| Autor | Zpráva | ||
|---|---|---|---|
| Suta Profil |
#1 · Zasláno: 26. 10. 2011, 22:55:33 · Upravil/a: Suta
Nevím, zda-li existuje řešení, které by mi pomohlo. Tuším totiž, že se jedná o jednu z dalších překážek, které mí stále přináší pouze IE (toto téma prosím neřešme). Přejdu ke konkrétnímu problému.
Verze 1 Událost mousemove navázaná na document + zobrazení pozice myši (pozice myši je zobrazována z důvodu, aby bylo vidět plynulost/neplynulost této operace.
window.onload = function(){
document.onmousemove = function(e) {
e = e || window.event;
document.getElementById("mouse").innerHTML = "mouse x: " + (e.pageX || e.clientX) + "<br>mouse y: " + (e.pageY || e.clientY);
}
}
<div id="mouse" style="position: fixed; left: 50%; top: 50%; padding: 20px; font-size: 30px; background-color: white; z-index: 2"></div>
Verze 2 Vložení většího množství elementů (150 rodičovských + v každém rodiči 2 děti = 450 elementů) do stránky, css :hover efekt.
<style>
* { margin: 0; padding: 0; }
.parent{
border: 1px solid red;
position: relative;
padding-left: 210px;
padding-right: 210px;
}
.parent:hover{
background-color: #9acd32;
}
.left{
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 200px;
background-color: silver;
}
.right{
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 200px;
background-color: #bc8f8f;
}
</style>
<div class="parent">Parent div - relativní pozice<div class="left">Absolutní pozice vlevo</div><div class="right">Absolutní pozice vpravo</div></div>
Dosud v obou ukázkách funguje vše bezproblémově, ve všech prohlížečích. Verze 1+2 (spojení) Spojení prvního a druhého příkladu dohromady. Při pohybu myši nemá Internet Explorer šanci. Problémem není konkrétní použití absolutí pozice, stejně se IE chová v případě floatovaných prvků, při použití např. :hover efektu na jakkoliv jinak umístěné prvky či v případě použití :before, :after, složitějším zanoření prvků atd. Jeho schopnosti brutálně klesají s počtem prvků na stránce. Žádný jiný prohlížeč s tímto problém nemá. Pro upřesnění - když oněch 450 elementů vyměním za 4500 elementů, ostatní prohlížeče se stále chovají stejně. IE odpadne zcela. Existuje řešení? Řešení konkrétního problému, kdy bych např. rád přesouval plynule prvky na stránce (nutné použití mousemove) i pří velkém množství vložených elementů (a nemusel uživatele tohoto prohlížeče posílat k čertu)? Díky za případnou pomoc. |
||
| joe Profil |
#2 · Zasláno: 27. 10. 2011, 03:00:10
Suta:
„které mí stále přináší pouze IE“ Bylo by dobré příště napsat jaká verze. Problém se mi vyskytuje jen v IE8, ve všech ostatních funguje jak má. „Problémem není konkrétní použití absolutí pozice“ Zřejmě je, protože stačí odstranit CSS pro třídu .left nebo .right, pak to také funguje. „stejně se IE chová v případě floatovaných prvků“ U mě tedy ne, pokud jsem si CSS změnil přes floatování, fungovalo to normálně: * { margin: 0; padding: 0; }
.parent {
border: 1px solid red;
position: relative;
clear: both;
}
.parent:hover {
background-color: #9acd32;
}
.left {
float: left;
width: 200px;
background-color: silver;
}
.right {
float: right;
width: 300px;
background-color: #bc8f8f;
} |
||
| Chamurappi Profil |
#3 · Zasláno: 27. 10. 2011, 10:27:50
Reaguji na Sutu:
„Spojení prvního a druhého příkladu dohromady. Při pohybu myši nemá Internet Explorer šanci.“ Nepozoruji ve své sedmičce žádný problém. Osmička reaguje trochu pomaleji, ale jen v osmičkovém režimu (nezkoumal jsem proč). Nevím, jestli je to tenhle případ, ale obecně jsou výkonnostní problémy s fixním pozicováním — ve všech prohlížečích, i když někde méně znatelné. Testoval jsi, jestli onmousemove reaguje stejně i v případě, že v něm neměníš rozměry a/nebo obsah fixního elementu?
„Jeho schopnosti brutálně klesají s počtem prvků na stránce.“ Vždycky jde nějak snížit počet prvků, kterých se efekt týká. „a nemusel uživatele tohoto prohlížeče posílat k čertu“ Méně hezký efekt je důvodem k vyhnání? V tomhle si fakt asi nikdy neporozumíme. |
||
|
Časová prodleva: 12 let
|
|||
0