Weisse Pixel im Bild - Avisio Theme

Dutchman1887

Hallo WPler,

ich habe derzeit ein ungewöhnliches Problem. Im Avisio-Theme erscheinen, meist auf dunklen Bildern, weisse Pixel auf den Artikelbildern. Dieses Phänomen tritt nur im IE auf. Ich kann leider nicht auf mein Projekt linken, da noch Verzeichnisschutz, aber bei mehreren Theme-Usern wie zB http://peter.schoenmann.at/portfolio/juwelier-schonmann (dort Bild oben - mal mouseover machen) tritt dieser Fehler auf. Das Support-Forum von Kriesi.at ist leider derzeit offline, daher stelle ich die Frage mal hier.

Kann jemand etwas zu dem Fehler sagen ? Bei Bedarf gebe ich Passwort für mein Projekt per PN raus.

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Tutrix

Vermute mal das dieses Problem bei jpg Format auftritt.

Speichere die Bilder mal als png ab und teste es dann nochmal

Dutchman1887

Die Idee hatte ich aber auch schon, als PNG und dann hintergrund Schwarz.
mmhh, aber png wird zu groß und kann ich nicht in ordentlicher Qualität mit Photoshop komprimieren... bin aber auch kein Photoshop Pro.

Tutrix

In der Komprimierung von jpg und des damit verbundenen Datenverlusts, dürfte aber das Problem liegen.
Vor allen dann, wenn noch Anwendungen wie die Lightbox (mit Alphafilter) ins Spiel kommen.
Der IE hatte da ja schon immer Probleme.

Du kannst ja PNG-8 verwenden statt PNG-24, dann dürften die KB auch nicht viel höher sein, als ein JPG mit niederer Qualität.

Dutchman1887

ich kriegs nur auf max 150KB runter (und dann siehts auch noch nichtmal sooo gut aus) und das ist deutlich zuviel, oder ? Ich versuche jedenfalls immer die kleinstmögliche KB-Zahl zu erreichen.

Dutchman1887

aber es stimmt, mit png sind die weissen Pixel weg. Aber leider sind die Bilder dann zu groß. Muss ich wohl mal nen Profi an die Bilder lassen (was eigentlich nicht der Sinn der Sache bei einem Kauf-Theme ist, oder?)

Tutrix

Das Problem ist der Alphafilter, also die Transparenz bei mouseover.
Das verträgt sich nicht mit jpg und IE.
Hat also eigentlich nichts mit dem Theme zu tun

Dutchman1887

ah, ok.
Kann man den irgendwo ausschalten ? Wäre mir nicht so wichtig.
Vielen Dank schon mal bis hierher.

Tutrix

da musst mal bei dieser Lightbox suchen

da müsste

Code

opacity: wert;

und für den IE dann

Code

filter: alpha(opacity=wert);

oder

Code

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=wert);

definiert sein

bei wert steht dann natürlich eine Zahl

[COLOR=Red]Edit[/COLOR]: laut Quelltext steht dies beim IE

Code

style="filter:  alpha(opacity=100); ZOOM: 1;"

Dutchman1887

Das ist die CSS von der Thickbox. Ich habe schon an ein paar Werten rumgespielt, aber keine Veränderung. Was mach ich falsch?

Code

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
 font: 12px "Lucida Grande", Verdana, Arial, sans-serif;
 color: #333333;
}
#TB_secondLine {
 font: 10px "Lucida Grande", Verdana, Arial, sans-serif;
 color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
 position: fixed;
 z-index:100;
 top: 0px;
 left: 0px;
 height:100%;
 width:100%;
}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
 background-color:#000000;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
 filter:alpha(opacity=75);
 -moz-opacity: 0.75;
 opacity: 0.75;
}
* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {
 position: fixed;
 background: #ffffff;
 z-index: 102;
 color:#000000;
 display:none;
 text-align:left;
 top:50%;
 left:50%;
 border: 1px solid #555;
 -moz-box-shadow: rgba(0,0,0,1) 0 4px 30px;
 -webkit-box-shadow: rgba(0,0,0,1) 0 4px 30px;
 -khtml-box-shadow: rgba(0,0,0,1) 0 4px 30px;
 box-shadow: rgba(0,0,0,1) 0 4px 30px;
}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {
 display:block;
 margin: 15px 0 0 15px;
 border-right: 1px solid #ccc;
 border-bottom: 1px solid #ccc;
 border-top: 1px solid #666;
 border-left: 1px solid #666;
}
#TB_caption{
 height:25px;
 padding:7px 30px 10px 25px;
 float:left;
}
#TB_closeWindow{
 height:25px;
 padding:11px 25px 10px 0;
 float:right;
}
#TB_closeAjaxWindow{
 padding:6px 10px 0;
 text-align:right;
 float:right;
}
#TB_ajaxWindowTitle{
 float:left;
 padding:6px 10px 0;
}
#TB_title{
 background-color:#e8e8e8;
 height:27px;
}
#TB_ajaxContent{
 clear:both;
 padding:2px 15px 15px 15px;
 overflow:auto;
 text-align:left;
 line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
 padding:15px;
}
#TB_ajaxContent p{
 padding:5px 0px 5px 0px;
}
#TB_load{
 position: fixed;
 display:none;
 z-index:103;
 top: 50%;
 left: 50%;
 background-color: #E8E8E8;
 border: 1px solid #555;
 margin: -45px 0pt 0pt -125px;
 padding: 40px 15px 15px;
}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{
 z-index:99;
 position:fixed;
 top: 0;
 left: 0;
 background-color:#fff;
 border:none;
 filter:alpha(opacity=0);
 -moz-opacity: 0;
 opacity: 0;
 height:100%;
 width:100%;
}
* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_iframeContent{
 clear:both;
 border:none;
 margin-bottom:-1px;
 _margin-bottom:1px;
}

Alles anzeigen

Tutrix

bist du sicher das dein Beispiel, das gleiche Theme verwendet?

da hier eine [COLOR="Red"]Lightbox[/COLOR] im Spiel ist

Code

<a title="XXXXXXXX" href="http://XXXXXXXX/wp-content/uploads/2010/12/XXXXXXX-front-page_preview-940x440.jpg" [COLOR=Red]rel="lightbox[grouped]"[/COLOR]><img width="574" height="268 " title="JXXXXXX" alt="" src="http://XXXXXXXX/wp-content/uploads/2010/12/XXXXXXX-front-page_preview-574x268.jpg" style="opacity: 1;"><span class="[COLOR=Red]lightbox_image[/COLOR] " style="height: 280px; width: 586px; top: 1px; left: 1px;"></span></a><img width="574" height="268 " title="XXXXXXX" alt="" src="http://XXXXXXXX/wp-content/uploads/2010/12/XXXXXXX-front-page_preview-574x268.jpg" 
[COLOR="Red"]style="filter:  alpha(opacity=100); ZOOM: 1;"[/COLOR]>

oder diese Thickbox ist für etwas anderes zuständig

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Weisse Pixel im Bild - Avisio Theme

Jetzt mitmachen!