Potýkám se už nějakou dobu s následujícím problémem:
Chtěl jsem si dát jako backgroundimage pod texty poloprůhledný png, abych mohl mít pod vším nějaký další obrázek a přitom zůstaly texty čitelné. Vypadá to efektně. Bohužel ale IE (na rozdíl od většiny ostatních prohlížečů) nezobrazuje alfa kanál. Avšak vzhledem ke skutečnosti, že asi 80% všech přistupuje na net právě přes IE, bylo nutno řešit tento nedostatek hackem. To se mi po dlouhém hledání (ne každý stopro funguje)povedlo. Až na jednu maličkost to funguje. Podklad je průhledný ve všech blocích, až na hlavní. Backgroundimage png jsem přidal do CSS - class "modryram" (nechtělo se mi vytvářet nový styl, proto používám freestyle). Funkce hacku je v hlavním bloku zřejmě rušena nějakým dalším povelem, protože pozadí je zcela průhledné, namísto zpoloviny.
Vyzkoušel jsem už vše, co mě napadalo. Png jsem zařadil taky do stylu bloků v lengine.php, odtud přebírají vlastnosti všechny bloky, jen ten hlavní si dělá co chce. Zkoušel jsem vypínat některé třídy CSS a pak zase změnit lengine.php i cla-press.php, ale všechno marné. Průhlednost hlavního bloku je stále 100%, namísto třeba 30...
Jestli jste se někdo prokousali až sem a napadá vás něco, budu vám nesmírně zauzlován za každý tip.
Díky moc

... ještě bych přidal, že je to s největší pravděpodobností o tom, jak zařadit ten hack - je to javascript - aby fungoval i v hlavním bloku. V Mozille, kde funguje png a alfa je vše jak má být...



Celkem upraveno 1×. Poslední úprava Saxxl v 21.05.2005 04:04.

Joo pruhledny png v ie je pakarna. Nebylo by lepsi dat do to gifu? :-D

Takhle me nic nenapada, bez ukazky ti asi nekdo tezko poradi; zaprve nevim jak ta stranka vypada a za druhe nevidim ten javascript...

Jenom me napada - jak poznas ze je to 100% pruhlednost? Co kdyz tam to pozadi neni?

--
[ SAFUS.EU | OFFLINE | FOREVER ]

da sa to vyriesit javascripton aby alpha kanal fungoval aj v IE

v prilohe najdes ten javascript

uz potom staci len prepisat koncovku na .js a zavolat si ho v layoute a malo by to bezat. videl som demonstraciu a vazne to islo :)

____________________
smiko.host.sk/phprs/



Celkem upraveno 1×. Poslední úprava smiko v 21.05.2005 12:08.

No asi jsem to napsal moc složitě.
Tu průhlednost mám už vyřešenou (těch scriptů jsem vyzkoušel asi osm, než jsem narazil na ten funkční).
Funguje to ve fšech sloupcích, tedy blocích , jen v tom hlavním to jaksi něco ruší. To, že tam ten png je, poznám při natahování stránky v ie, kdy na zlomek vteřiny se objeví neprůhledný png, pak zafunguje hack a všechny sloupce jsou poloprůhledné, tak jak to chci, jen ten hlavní (myslím tím jen články) je průhledný úplně.
Protože na vzhledu článku se podílí více prvků - lengine, cla-press, css - myslím, že někde tam dochází ke kolizi s hackem a tedy chybě.
Když do toho prostředního sloupce pošlu cokoli jiného než hlavní blok (články), tak je to taky v pořádku...

Na webu bohužel ještě nic neběží, jen na lokále, právě proto. že to nefunguje.

Když si uvědomím, že se s tím pinožím jen kvůli blbosti ie, tak je mi z toho nanic. Už jsem mohl dělat něco jiného, ale 80% je 80%...

Přikládám alespoň náhledy, aby bylo jasné, co mě trápí.
V IE, v hlavním bloku dochází k úplnému zprůhlednění png, v ostatních blocích je to v pořádku.
Potřebuju odhalit, čím dochází k deformaci funkce hacku v hlavním bloku.
Chtělo by to asi slovo tvúrce...

Možná se mi podaří přidat i náhled z Mozilly pro srovnání



Celkem upraveno 2×. Poslední úprava Saxxl v 22.05.2005 16:55.

Taky ne...



Celkem upraveno 3×. Poslední úprava Saxxl v 22.05.2005 16:56.

Tak teď!

Ako presne si definoval tú priehľadnosť? Ako sú definované rodičovské (obsahujúce) bloky? Lepšie by bolo spraviť ten png jednoducho svetlejší, dostaneš rovnaký efekt ak teda nemá byť priehšadný voči dalšiemu bloku. Dalo by sa to ešte spraviť "sitom" - v grafickom editore dáš masku na pixely do šachovnice. Použil som niečo také na [http://www.sdku.bnb.sk]

Priehľadnosť pomocou CSSka je použitá aj v layoute rsBloger (napr. šablona mod2, nápis webu v bloku #zah-l1 a trieda .opc), ak chceš mrkni sa do štýlopisu na systém použitia.



Celkem upraveno 1×. Poslední úprava pa3k v 03.06.2005 10:23.

citujem z [http://www.jakpsatweb.cz/css/filter.html]
----------------8<---------------------
Poloprůhledné PNG v Exploreru

<img src="ten_samy_obrazek.png" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='ten_samy_obrazek.png'); _width:1px; _height:1; " width="150" height="150">

V Internet Exploreru není podporován alfa kanál grafického formátu PNG. Přidáním tohoto šíleného filtru se začne obrázek chovat poloprůhledně (v jiných prohlížečích je poloprůhledný automaticky). Dejte si pozor na nastavení rozměrů, ilustruji to v příkladu. Pokud nastavíte pouze skutečné rozměry obrázku, Explorer to nezprůhlední. Teprve pokud srazíte obrázek podtržítkovým hackem do tečky 1x1px, Explorer obrázek smrskne na tečku (šedivá v horním rohu, nejde zrušit), ale zbytek obrázku vykreslí průhledně a vůči okolí se obrázek chová, jako by měl skutečné rozměry 150x150.t

Poloprůhledné pozadí takto udělat nejde, pokud vím. Jenom pozicováním. Když se ten filtr přilepí třeba na div (musí mít také fejkové rozměry 1x1), tak to sice funguje, ale pak uvnitř té oblasti nefungují odkazy. Debilní explorer.

pa3k napsal/a:
-------------------------------------------------------
> ....Debilní explorer.

bohuzel ano.
IMHO ani ty "hacky" moc nepomahaji. IE je proste "shit" a po uvedeni IE7 to nakonec dopadne tak, ze se budou stranky tvorit pro "Browsery" a potom pro IE7 a IE5.5/6...
je to opravdu strasne a obcas nepomaha ani prepnuti do "strict" modu.
ale to je na "flamware" a "offtopic"

BTW delal jsem jeden univerzalni layout pro jeden web. Sice se to ted zobrazuje naprosto dokonale ve vsech prohlizecich, ale nechtejte vedet, kolik casu to zabralo diky IE... :-(

edit: PNG a Alfa-kanal v IE stejne poradne nefunguje...:-(

s pranim pekneho weekendu

-- JaV ---- [http://www.hades.cz] ---- security by obscurity ---------------------------------------------
motto:
It's OK to be ignorant; it's not OK to play stupid.
But it's simply not efficient for us to try to help people who are not willing to help themselves.
----------------------------------------------------------------------------------------------------------------------



Celkem upraveno 1×. Poslední úprava JanVar v 03.06.2005 21:51.

Zdravím...
Měl jsem poněkud jiné starostě, takže jsem byl chvíli mimo...
Teď je konečně možnost se podívat, co jsem vlastně patlal...
Průhlednost funguje ve všech rubrikách a blocích mimo ten hlavní, tam ruší funkci hacku něco, co nemůžu objevit...
Aby to v IE bylo ke čtení, ještě více jsem zjemnil fotku na pozadí...
Kdyby mi někdo poradil, jak donutit i ten hlavní blok, tak mu snad zazpívám...
Mám na tomto principu rozdělaný další layout a tam bych to fakt potřeboval...
Díky za čas...

[url] [http://www.stedraruka.cz] [/url]

Pozri na ten rsBloger layout ;) fakt stačí keď dáš pozadiu článku farbu a CSS priesvitnosť. Ja v tom fakt nevidím žiadny problém :)



Celkem upraveno 1×. Poslední úprava pa3k v 07.06.2005 08:36.

Konkrétne:

.opc	{
	opacity:0.9; _filter:alpha(opacity=90);
	}

článok bude vyzerať potom takto: <div class="clanek opc">
alebo daj priamo triede clanek opacity alebo filter:alpha(opacity=XX);
v kombinácii s background-color dosiahneš presne čo potrebuješ bez javascript hackov.



Celkem upraveno 2×. Poslední úprava pa3k v 07.06.2005 08:37.

Předně ti píšu "tlustou jedničku" za rsBloger!!!
A teď k průhlednosti. Zkoušel jsem, cos mi radil, ale má to dva háčky...
První je, že se "zprůhlední" všechno, tedy i text, ale to by při určitém laborování šlo vychytat a někde jsem už na to v nějakém fóru narazil, ale horší je, že se to chová zase jinak v IE, než v MF.
V MF to fungovalo na celý článek v IE vůbec, v MF to nefungovalo v ostatních blocích v IE také ne.
Zkoušel jsem všechny možné kombinace (CSS, lengine, *.sab).
Zkus se ještě podívat na výše uvedený link. Chtěl bych využívat pevného pozadí, na kterém jsou ostatní podkladové prvky poloprůhledné a texty a obrázky normální.
Další řešení je nechat to tak, jak to mám, protože MF to ukáže tak, jak chci bez problémů, protože to umí a v IE to prostě zatím bude neprůhledné. Až to do IE dodají, tak to začne fungovat...
Když si zase uvědomím, že je to jen kvůli hlouposti IE...

To je OK, priehľadnosť nenastavuj scriptom, ale len tým CSSkom. Ten script vyhoď nebude ho treba.

Pozadie celého layoutu máš ako img. to je OK - je jedno či je png alebo jpg/gif, pretože filter opacity aplikujeme na objekty ktoré sú "nad" ním. To znamená, že stačí ak dáš priesvitnosť článku, blokom a rámu. Všetko len v CSS, pomocou konštrukcie čo som písal hore. Neviem ako sa volajú tie CSS triedy v tvojom layoute ale asi nejak podobne. Samozrejme chytí priesvitnosť celý obsah bloku, t.j. aj text, lenže ak je text čierny a pozadie biele/svetlé je to vporiadku.

CSS:
.opc {
opacity:0.9; _filter:alpha(opacity=90);
}
definicia opacity zaberie pre mozillu, firefox a spol. a ta druha definicia s podtržítkovým hackom je ONLY pre IE sh!t. Takto netreba žiadny javascript. Bol by treba jedine ak by si chcel (kôli tomu aby nebolo priesvitne pismo ale len pozadie) vytvoriť z pôvodného bloku dva bloky, jeden s pozadim, priehľadny a druhy by mal rovnaku velkosž, len by bol nad nim, bez pozadia, len pismo. Skúsim ešte mrknúť do tvojho CSSka.

Chcelo by to pridať do CSS definicie .modryram toto: opacity:0.9; _filter:alpha(opacity=90);
+ background-color:#fff; napriklad
to by malo byť všetko.
btw: s tym fixed backgroundom to dost vytažuje aj silnejsie stroje, neda sa ani normalne scrollovať AthlonXP ide na 90%

Nefunguje to...
Ten .modryram jsem už zkoušel, přesně jak píšeš a teď pro jistotu znovu a nic, čistá bílá... Tedy v IE...
V MF to funguje...
Myslím, že problém je někde jinde, stejně se totiž chová i verze png-hack... V IE vše poloprůhledné, jen hlavní blok s články průhledný úplně... Z nějakého důvodu v hlavním bloku pro IE tyto věci nejedou?!?!?!
Dal bych to na net, ale nemůžu s tím šaškovat, koukají tam lidi...

Kontrolna otazka: aká je verzia IE? Lebo podľa mojich skúseností filtre podporuje na 100% az IE 6, s IE5.5 je to tak napoly, neviem od akých systémových knižníc to závisi ale spoľahnúť sa na to (ako je u IE zvykom) samozrejme nedá. Podľa niektorých návodov (napr [http://www.jakpsatweb.cz/css/css-filtry.html#podpora]) zvláda CSS filtre už IE5, dokonca vraj IE4!!! :) Yuhu by to mohol vysvetliť.

Podľa samotného malého mäkkého z redmondu [http://www.msdn.microsoft.com/library/default.asp?url=/workshop/author/filter/reference/reference.asp]
tieto filtre podporuje už IE 5.5 ale z mojich skúseností to NEFUNGUJE. Používam ale neoficiálny IE z developer pack, kde je spolu IE3, IE4, IE5 a IE5.5. Skúšal som CSS zápis ktorý som spomínal v predch. postoch a nič. Tak isto na IE5.5 nie je funkčný ani takýto zápis: filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); Takže osobne na to kašlem a beriem to LEN ako bonus pre užívateľov poriadnych browserov + IE6. Zaujímavé je, že napr. Opera opacity nepodporuje vôbec, neviem ako je na tom verzia 8 ale v predch. verziách to bola rovnaká bieda, čo je škoda. Maxthon funguje, no s tým sú zas iné problémy... no to už je na dlhú debatu.
Skús ešte to sieťované šachovnicové pozarie GIFom ako background:url('sachovnica.gif');