ugrás a tartalomhoz

IE átlátszó PNG megjelenítése háttérben!

Marcell · 2006. Szep. 3. (V), 20.29
A problémám a következő: átlátszó PNG-t szeretnék megjeleníteni, de CSS-el a háttérben. Rákerestem és találtam is sokféle megoldást, de nálam mindig ott rekedt meg az egész, hogy csak akkor működik, ha egy <IMG> tagban jelenítem meg... Ha CSS-el berakom background: url("../kepek.png") no-repeat; kóddal, akkor szürke lesz a háttere.

Már legalább 3 különböző .htc fájlt linkeltem be és 2 órája olvasom a különböző tutorialokat, de egyik sem működött, csak ha az <IMG> tagban van a kép.

Van vmi működő megoldásotok?
‹ Felhasználó oda lépjen vissza később az oldalon, ahonnan elkattintott Linkre kattintás után egy frame ›
 ■
1

png

Anonymous · 2006. Szep. 3. (V), 20.38
Szia!

www.torzsasztal.com/alphaimages.js
1d 1x1-es átlászló gif a főkönyvtárba és lyukadni fog az explorerben is a png. Sőt árnyék átmenetes szegély, stb.
Ja és egy hívatkozás a html-ben a javara.
2

nem jó...

Marcell · 2006. Szep. 3. (V), 21.16
document.getElementsByTagName("IMG");
Ez sem jó nekem... Megint ott akadunk el, hogy csak akkor jó, ha <IMG> tagban van meghívva.
12

linkelés

vbence · 2006. Szep. 4. (H), 12.47
Azért a kis lelkemnek jól esett volna, ha az eredetit linkeled be, nodesebaj...
3

Ha fix akkor tedd be képként és trükköz rétegekkel

Jano · 2006. Szep. 3. (V), 21.31
Ha a grafika fix méretű, akkor tedd be képként és pozicionáld fölé a tartalmat.
6

talán..

Marcell · 2006. Szep. 3. (V), 22.18
Ezen is elgondolkoztam egy órával ezelőtt, de aztán a nagy szemantikai vitában úgy döntöttem, hogy besunyítom a háttérbe, hiszen csak egy keret - és végül sikerült is összeszenvedni, szóval jó döntés volt.
7

Helyes :)

Jano · 2006. Szep. 3. (V), 22.45
Egyébként ha a honlapodra kellett ahol homogén, vagy egyirányban grádienses oldal háttér elé kellett rakni bizonyos magasságba, az megoldható nem valódi átlátszó képpel is úgy hogy a háttér megfelelő részével együtt vágod ki.
11

színváltó háttér van

Marcell · 2006. Szep. 4. (H), 11.25
Sajnos ez nem ilyen egyszerű, mert a háttér színváltós - különböző CSS lapokat lehet váltogatni, amik más szín raknak a PNG alá. Így mindig egy másik háttérszínű keretet kéne betölteni, ami elég fapados megoldás... ezért is szenvedtem az átlátszósággal.
4

az explorert ismét különcként kell kezelni

Anonymous · 2006. Szep. 3. (V), 21.49
.pnghatter {
  BACKGROUND: none transparent scroll repeat 0% 0% !important;
  FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/hatter.png', sizingMethod='scale') !important;
További részletek:
http://www.tutorial.hu/node/945
5

nem valid

Marcell · 2006. Szep. 3. (V), 22.15
Na ez legalább működik, de sajnos nem valid. De sebaj, beraktam <!--[if ie]> és <![endif]--> közé, így átugorja a kis drága CSS elemzőnk :)

Köszönöm a segítséget.
8

Egy megoldás

krey · 2006. Szep. 3. (V), 23.17
Használj IE7-et, én is azt használom, a háttér pozícionálása sajnos nem egészen megoldott, de tiszta és egyszerű megoldás az IE sok problémájára. Ennyit a reklámról :)

üdv. krey
9

vagy firefoxot

rudo · 2006. Szep. 4. (H), 09.27
ez kb. olyan, hogy használjon mindenki firefoxot:) ezt is elég sokan mondjuk!
az ie7-et fogják is használni(sokan) de azért szvsz. továbbra is legalább az
ie6-ot kell kiszolgálni, mert az még évekbe telik mire mindenki lecseréli.

sőt használj vistát!!! fizetni már lehet érte....;)
10

többség dönt...

Marcell · 2006. Szep. 4. (H), 11.08
Az oké, hogy én nem IE-t használok, meg talán itt még jó páran, de ha egy jó weboldalt akarsz összerakni, akkor a többség dönt elve alapján kell összeszögelni az oldalt -> IE6-ra kell optimalizálni.
15

istenem

krey · 2006. Szep. 4. (H), 16.41
Ha vettétek volna a fáradtságot, hogy rákattintsatok a linkre, akkor most tudnátok, hogy az IE7 nem (csak) böngésző, hanem:
IE7 is a JavaScript library to make IE behave like a standards-compliant browser. It fixes many CSS issues and makes transparent PNG work correctly under IE5 and IE6 (learn more).

http:/dean.edwards.name/IE7
üdv. krey
16

ígéretes

vbence · 2006. Szep. 4. (H), 17.18
Bár nem szeretem a terebélyes frameworköket, ezt megkukkolom... Régebben én is dédelgettem hasonló terveket, majd beláttam, hogy lehetetlen feladat :)
17

PNG a háttérben?

Marcell · 2006. Szep. 4. (H), 18.37
Kipróbáltam és nálam megint nem működött, ha CSS-el volt a háttérben a PNG.
20

pedig igen!

krey · 2006. Okt. 1. (V), 16.16
Nálam működött, viszont elcsúsztak a háttereim. Írtam egy mélt Dean Edwards-nak és ő mondta, hogy a background-position-t meg még valamit valamiért nem tudta beletenni és hogy felejtsem el.

üdv. krey
21

Repeat és position

vbence · 2006. Okt. 1. (V), 16.38
A filter csak stretch-et tud, ezzel nagy százalékban kiváltható a repeat, de finomhangolásra nincs lehetőség. (Mindig a balfelső sarokban kezdődik). Talán ha a dom fába is belenyúlnánk, és külön div-eket helyeznénk el, meg clipping-et, de az már nem éri meg a fáradságot...
13

kész megoldás

vbence · 2006. Szep. 4. (H), 12.51
Kiegészítettem cikkemet, hogy a fenti problémát is kezelje. Nálam működik, tessék tesztelni.

http://vbence.web.elte.hu/ie_png_alpha.html

B
14

működik, de...

Marcell · 2006. Szep. 4. (H), 14.01
Szerintem tedd elérhetőve egy kész belinkelt fájlban is, mert így csak a kézzel lehet kimásolni és nálam közben elvesznek a sortörések és tördelhettem újra (Firefox alatt... IE alatt nem is lehet másolni és csak Opera viszi simán - persze ezt is csak a végén vettem észre). Másrészt mivel az egész egy sorba kerül, az egész egy hosszú komment lesz és így elsőre úgy tűnhet, hogy nem működik.

Amúgy nálam is megy (IE6-win), de én maradok a manuális módszernél, mert a JS-sel először bevillan nem átlátszóul, aztán egy villanás és átlátszó lesz (nyilván amikor végigmegy rajtuk). Natúr CSS-nél nincs ilyen.
18

sima?

MoDuLaToR · 2006. Szep. 30. (Szo), 19.07
Mi az, hogy sima módszer? Te mit használsz?
19

lásd 4. hozzászólás

Marcell · 2006. Okt. 1. (V), 16.08
Kuksold meg itt: http://weblabor.hu/forumok/temak/14966#comment-33201

A 'sima' nálam az, ha egy CSS fáljba beleírom a filter(eke)t, míg a másik lehetőség az, ha egy JS adja hozzá ezeket a tulajdonságokat automatikusan. A JS praktikusabb, mert nem kell sokat foglalkozni vele, de ott én zavaró bevillanást tapasztaltam, ezért maradtam a hagyományos (=első) módszernél.