Png Transparans

8 svar · 585 visningar · startad av flumpa 12 jan. 2006

flumpaMedlem sedan jan. 2003247 inlägg

Frågan12 jan. 2006 20:40#1

Hej

Nu är jag på djupt vatten igen

Jag har en bakrundbild transparant Png runt min table hemsida.
Så mitt problem är att jag skulle vilja att transparansen fungerar i IE.

http://www.gaspop.com/flumpa/Index.html

Hittade lite anvisningar om hur man ska göra det när jag sökte här på webforum.

Man ska tydligen skriva så här:

<img src="blank.gif" style="width: 100px; height: 100px; filter:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png', sizingMethod='scale')" />

Men hur gör jag om jag vill få in den i den här classen?

.botten{
background: url(hud/trans_botten.png) repeat-x; width: 800px; height: 15px; }

Tack på förhand

InsiderMedlem sedan jan. 2000978 inlägg

12 jan. 2006 23:38#2

Det kan vara så att egenskapen bara fungerar på <IMG> och inte på bakgrundsbilder. Här är i alla fall mer läsning.
http://www.google.com/search?q=filter+css+png+transparent&start=0&ie=utf-8&oe=utf-8&client=firefox-a&rls=org.mozilla:en-US:official
(dom två första träffarna)

flumpaMedlem sedan jan. 2003247 inlägg

13 jan. 2006 11:59#3

Det värkar som om det ska gå,
hittade den här sidan.

Problemet är att jag vet inte riktigt hur jag använder mig av det
http://www.webmasterworld.com/forum83/7828.htm

flumpaMedlem sedan jan. 2003247 inlägg

13 jan. 2006 12:06#4

Föresten finns det något annat sätt att faka skugan som jag vill ha runt sidan?

flumpaMedlem sedan jan. 2003247 inlägg

13 jan. 2006 12:42#5

Hittade även wn andra sida som värkar lovande.
Samma där, förstår inte riktigt hur jag använder mig av de.

http://www.hintzmann.dk/testcenter/css/png/index2.html

flumpaMedlem sedan jan. 2003247 inlägg

13 jan. 2006 16:31#6

jag löste de så jag behöver ingen hjälp

learnMedlem sedan jan. 20051 130 inlägg

19 jan. 2006 20:26#7

Ok, men hur löste du det...?

pimpNMedlem sedan okt. 200589 inlägg

21 jan. 2006 02:32#8

1. Skapa en Internet Explorer-specifik CSS-fil vid namn url(style.css) all

@import url(style.css);

.botten {
background-image: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='hud/trans_botten.png', sizingMethod='scale');
}

2. Lägg till följande i din vanliga CSS-fil som har namnet style.css

.botten { background: url(hud/trans_botten.png) repeat-x; width: 800px; height: 15px; }

// Oliver Olofsson

stephanMedlem sedan feb. 2006117 inlägg

9 feb. 2006 11:02#9

Jag vet inte om detta biter på bakgrundsbilder men ett annat sätt är att låta IE rita om bilderna när sidan laddat klart. Detta var en smidig lösning för mig eftersom jag automatiskt inkluderar denna kod i alla ny sidor, så nu behöver jag inte tänka på om jag använder png-transparens nånstans.

<!--[if gte IE 5.5000]>

<script language="JavaScript">

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.

   {

   for(var i=0; i<document.images.length; i++)

      {

	  var img = document.images[i]

	  var imgName = img.src.toUpperCase()

	  if (imgName.substring(imgName.length-3, imgName.length) == "PNG")

	     {

		 var imgID = (img.id) ? "id='" + img.id + "' " : ""

		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""

		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "

		 var imgStyle = "display:inline-block;" + img.style.cssText

		 if (img.align == "left") imgStyle = "float:left;" + imgStyle

		 if (img.align == "right") imgStyle = "float:right;" + imgStyle

		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle

		 var strNewHTML = "<span " + imgID + imgClass + imgTitle

		 + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"

	     + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"

		 + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"

		 img.outerHTML = strNewHTML

		 i = i-1

	     }

      }

   }

window.attachEvent("onload", correctPNG);

</script>

<![endif]-->