| Autor | Zpráva | ||
|---|---|---|---|
| Filip Jirsák Profil |
#1 · Zasláno: 29. 10. 2007, 15:18:03 · Upravil/a: Filip Jirsák
Zdravím,
následující kód se chová jinak v Opeře a jinak v MSIE a FF (styl listu je základní list-style-position: outside)
FF i MSIE vyvolají událost i v případě, když kliknu na odrážku. Opera ji vyvolá pouze v případě, když kliknu na samotný text odrážky. Na jednu stranu je to logické – odrážka je už mimo oblast elementu <li>. Na druhou stranu je chování Opery dost nepraktické :-( Otázka č. 1 – které chování (MSIE+FF nebo Opera) je správné? Otázka č. 2 – existuje nějaký postup, jak od Opery získat událost i při kliknutí na odrážku? Napadají mne dva způsoby – změnit styl na list-style-position: inside a uvnitř zarovnat víceřádkový text pomocí padding, nebo pověsit událost na celý <ul> a podle pozice myši a umístění jednotlivých odrážek spočítat, ke které odrážce dané kliknutí patřilo. Ani jedno řešení mi ale nepřipadá moc elegantní… |
||
| tiso Profil |
#2 · Zasláno: 29. 10. 2007, 15:37:53
1. irelevantné, ak sa nemýlim, tak nie je stanovené či odrážka má byť riešená cez margin alebo padding prvku.
2. riešenie by bolo odrážku zrušiť a spraviť ju pomocou obrázku na pozadí, vtedy by to šlo. Otázka znie kvôli čomu to potrebuješ? A prečo používaš ten JS? Máš prístupnú alternatívu? |
||
| Filip Jirsák Profil |
#3 · Zasláno: 29. 10. 2007, 16:01:02
1. Opera i FF to řeší marginem (pokud se nastaví prvku <ul> a <li> jiná barva pozadí, je pod odrážkou pozadí <ul>). Navíc FF reaguje událostí onclick na kliknutí mimo plochu <li> pouze v případě, že kliknete opravdu na odrážku nebo blízké okolí (zřejmě plocha znaku odrážky). Když kliknete někam jinam, ale stále ještě do marginu, událost onclick nevyvolá ani FF.
2. Jde o rozbalovací strom, kde text listu vede na stránku s příslušným podstromem. Pokud tedy někdo má zapnutý JS a klikne na text listu, otevře se mu stránka, kde je podstrom zobrazen podrobněji. Pokud se zapnutým JS klikne na odrážku, příslušný podstrom se rozbalí rovnou na stránce a lze kliknout přímo na cílový odkaz (bez načtení mezistránky s podstromem). Nejjednodušší řešení je ten strom v Opeře vůbec nezabalovat. Ale překvapilo mne, že jsem o tomhle chování Opery nikde nic nenašel. |
||
| Chamurappi Profil |
#4 · Zasláno: 29. 10. 2007, 16:15:55
Reaguji na Filipa Jirsáka:
Což takhle nastavit „display: block“ pro <li> a „display: list-item“ pro <span> obalující vnitřek <li>? Mohlo by to vypadat stejně a blokový <li> by pak měl spolehlivě chytat kliknutí po celé své ploše. |
||
| Filip Jirsák Profil |
#5 · Zasláno: 29. 10. 2007, 16:51:47
Použití display: block pro <li> je podobné použití list-style-position: inside – na kliknutí pak reaguje opravdu celá plocha <li>. Chování FF (a MSIE) je ale takové, že reaguje plocha <li> + malá plocha okolo odrážky. Rozdíl je tedy v tom, že s chováním FF mi stačí pro všechny prvky vložené v <li> zastavit probublávání události (resp. na událost reagovat jen když event.target == event.currentTarget, kdyby to fungovalo v MSIE), ale s čímkoli co „vypadá jako seznam ale není to seznam“ to znamená ještě kontrolovat pozici kurzoru myši, zda se uživatel trefil přibližně do odrážky. Uvidím, zda bude stát za tu námahu tohle implementovat, nebo zda prostě pro Operu zabalování stromu zakážu.
Mimochodem, DOM2 říká o onclick: „The click event occurs when the pointing device button is clicked over an element.“ CSS2.1 o list-style-position: outside: „The marker box is outside the principal block box. CSS 2.1 does not specify the precise location of the marker box.“ O tom, zda „over an element“ znamená „over the principal block box“ (jak to implementuje Opera), nebo zda to znamená „kliknutí nad čímkoli, co je z elementu vidět“ (jak to dělá FF či MSIE) asi nejde rozhodnout. Díky oběma za rady. |
||
| Chamurappi Profil |
#6 · Zasláno: 29. 10. 2007, 18:15:20 · Upravil/a: Chamurappi
Reaguji na Filipa Jirsáka:
„Použití display: block pro <li> je podobné použití list-style-position: inside“ Vezmu-li v úvahu předchozí popis možného postupu: > „změnit styl na list-style-position: inside a uvnitř zarovnat víceřádkový text pomocí padding“ Tak ta mnou navržená podobná konstrukce má myslím nespornou výhodu v tom, že funguje. Padding ti totiž odsune i tu „inside“ odrážku, takže víceřádkový text nijak neošetří, ne? „Rozdíl je tedy v tom, že s chováním FF mi stačí pro všechny prvky vložené v <li> zastavit probublávání události“ Plocha <li> je kromě toho puntíku zaplněna blokovými elementy? Jestli ne, tak neprobublané kliknutí na <li> může být vyvolané i kliknutím na místo vpravo od obsahu, protože ten principal block box je blokový. Jestli ano, tak může být stejně zaplněný i blokový <span> uvnitř <li> a pak je neprobublané kliknutí na <li> vždy přibližně v místě, kde je puntík (v místě levého paddingu <li>). Nebylo by lepší mít tam vlastní puntík tvořený dalším elementem uvnitř <li>? Měl bys pod kontrolou jeho pozici, nemusel bys řešit probublávání, ani jiné nekompatibility. Znásilnění přírodního puntíku mi stejně nepřipadá jako elegantní řešení. „O tom, zda ‚over an element‘ znamená ‚over the principal block box‘, nebo zda to znamená ‚kliknutí nad čímkoli, co je z elementu vidět‘ asi nejde rozhodnout“ Generovaný obsah v pseudoelementech „:after“ a „:before“ může být též mimo hlavní box elementů a na události v Mozille i Opeře reaguje. DOM s pseudoelementy nepočítá, takže buď jde s jejich pomocí vytvářet na stránce hluchá místa, která na události nijak nereagují, nebo se předpokládá, že jsou součástí elementu. Druhá možnost mi připadá smysluplnější a stejnou logiku bych užil i na odrážky. |
||
|
Časová prodleva: 16 let
|
|||
0