PDA

Zobacz pełną wersję : [JS, hack] PNG w IE



llukasz
19-05-2007, 10:35
Witam!
Znalazłem już chyba dziesiątki różnych sposobów na ominięcie problemu png z przeźroczystością alfa w IE, niektóre lepsze, niektóre gorsze, jednak już się trochę pogubiłem http://forum.skryptoteka.pl/img/smilies/usmiech.gif i sam nie wiem czy istnieje taki, który po 1) zadziała bez ustawiania parametrów width i height przy osadzaniu plikow png po 2) zadziala poprawnie po 3) zadziala w przypadku tla np. w divie lub tabelce i po 4) nie bedzie dawal efektu szarego tla podczas ladowania strony pod danym obrazkiem - czy ktoś spotkał się z takim sposobem (nie wiem czy jestem zbyt wymagający http://forum.skryptoteka.pl/img/smilies/usmiech.gif)

xfm
19-05-2007, 11:09
Z tym IE, to same problemy. Również borykam się z podobnym problemem i nie wiem czy nie powrócę do jpg jako tło i obramowanie strony.

Dylek
19-05-2007, 12:15
A zobacz, moze to (http://www.mambopl.com/content/view/136/48/) Ci cos da.

llukasz
19-05-2007, 13:47
Ten skrypt nie działa wcale... ani dla png normalnie ani jako tło więc... jeśli nie ma takiego, któy spełnia moje oczekiwania, to może OSTATECZNIE taki, który wyświetlał by te nieszczęsne tło szare w czasie ładowania, ale, żeby chociaż nie zmieniał rozmiarów obrazka...

zwiastun
19-05-2007, 14:10
Obawiam się, że pozostaje Ci jedno - gifki dla IE, albo rozwiązanie łączone:
1) bot który załatwia sprawę w artach
2) .htc dla WSZYSTKICH z kanałem alfa w szablonie
3) unikanie jak ognia w koponentach, modułach .png z alfa.

llukasz
19-05-2007, 14:14
No, ale chyba robiąc to w szablonie w artach tez zadziala?

...od razu?

PS: gify odpadają, to już prędzej bym olał IE, ale ze względu na to, iż strona jest dla szkoł, nie dla mnie, to nie mam takiej możliwości - problem muszę jakoś rozwiązać...

PS2: odpowiada mi te rozwiązanie http://www.twinhelix.com/css/iepngfix/ jednak widać szare tło podczas łądowania strony - co prawda z tym jeszcze przeżyję, ale prosiłym kogoś kto zna JS o zmiane skryptu (jeśli się da), tak, by nie zmieniał wielkości obrazków... bo gdy obrazek nie jest tłem tlyko osadzony za pomocą <img> to wielkość zaczyna świrować coś...


<public:component>
<public:attach event="onpropertychange" onevent="doFix()" />

<script type="text/javascript">

// IE5.5+ PNG Alpha Fix v1.0RC4
// (c) 2004-2005 Angus Turnbull http://www.twinhelix.com (http://www.twinhelix.com/)

// This is licensed under the CC-GNU LGPL, version 2.1 or later.
// For details, see: http://creativecommons.org/licenses/LGPL/2.1/


// This must be a path to a blank image. That's all the configuration you need.
if (typeof blankImg == 'undefined') var blankImg = 'http://lukasz.websignuk.com/templates/lochow2007/grafika/blank.gif';


var f = 'DXImageTransform.Microsoft.AlphaImageLoader';

function filt(s, m)
{
if (filters[f])
{
filters[f].enabled = s ? true : false;
if (s) with (filters[f]) { src = s; sizingMethod = m }
}
else if (s) style.filter = 'progid:'+f+'(src="'+s+'",sizingMethod="'+m+'")';
}

function doFix()
{
// Assume IE7 is OK.
if (!/MSIE (5\.5|6\.)/.test(navigator.userAgent) ||
(event && !/(background|src)/.test(event.propertyName))) return;

var bgImg = currentStyle.backgroundImage || style.backgroundImage;

if (tagName == 'IMG')
{
if ((/\.png$/i).test(src))
{
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
filt(src, 'scale');
src = blankImg;
}
else if (src.indexOf(blankImg) < 0) filt();
}
else if (bgImg && bgImg != 'none')
{
if (bgImg.match(/^url[("']+(.*\.png)[)"']+$/i))
{
var s = RegExp.$1;
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
style.backgroundImage = 'none';
filt(s, 'crop');
// IE link fix.
for (var n = 0; n < childNodes.length; n++)
if (childNodes[n].style) childNodes[n].style.position = 'relative';
}
else filt();
}
}

doFix();

</script>
</public:component>