ugrás a tartalomhoz

IE onmouseover gond

Somnus · 2007. Május. 26. (Szo), 14.02
Az a problem hogy "animált" js-el akarom megoldani a menüzést az oldalamon a jelenlegi gif-es helyett.
http://buttonz.somnusoft.com
Csak ha a gomb fölé viszem az egeret ugyan elkezd animálni, de IE-ben visszavált sima nyilas kurzorra!
FF-ben nem csinálja ezt!
Olyanra gondoltam hogy egész dokumentumra átváltani a stílusban a kurzort hand-re majd vissza, de nemtudom hogy kell js-el ezt megoldani...
Valami javaslat?
Választokat előre is THX!
 
1

cursor: hand a DIVre

vbence · 2007. Május. 26. (Szo), 15.15
Mi van, ha itt állítod be a "cursor: hand"-et?

<div id="button_webtools" style="overflow: hidden; position: relative; width: 168px; height: 25px; background-image: url(transparent.gif); color: #000000">
3

cursor:hand

Somnus · 2007. Május. 26. (Szo), 18.08
Át tettem a "cursor:hand" ez a belső divről ahogyan mondtad, a külső divre, de ez se működik sajnos.
2

na

Fraki · 2007. Május. 26. (Szo), 15.43
A probléma ott van, hogy amikor hátteret vált, akkor újra elindul az onmouseout-onmouseover páros, ezért villódzik IE-ben a kurzor, és nálam FF2-ben az egész anim is villódzik.

Ezt úgy kéne megcsinálni, hogy az onmouseout-ban valami késleltetés van, mondjuk 100 ms, vagy 10. Ha a késleltetés alatt újra az onmouseover kap vezérlést, az onmouseout timeout-ja megszakad. Vagyis az out-ot timeout-olni kell, az over-ben pedig ezt a timeout-ot megszakíttatni.
4

RE: késletetés

Somnus · 2007. Május. 26. (Szo), 18.14
perpill dolgozok rajta, de naggyából értem mitmondasz!
és most csinálom hogy működjön is!
5

így sem megy :S

Somnus · 2007. Május. 26. (Szo), 18.46
így sem megy legalábbis én nemtudom, inkább hagyom a fenébe mással próbálkozok!
úgyérzem ez minden váltásnál elcsesződne így nem váltogatni fogom hanem az összes képet egymásra teszem és vagy z-indexxel vagy a jól bevállt visible: none és visible:block -al oldom meg.
Mit szóltok hozzá?
Szerintetek így is villogni fog? :) Lehet fogadni!
6

még most sem jó!

Somnus · 2007. Május. 27. (V), 14.00
átállítottam a képváltások közti időt 2 másodpercre, fel is tettem ide: http://buttonz.somnusoft.com
és észrevettem hogy amikor a div hátterét változtatom meg, akkor váltja le a hand kurzort simára :S
próbálkoztam olyannal is hogy egész body-ra (document.body.style.cursor="hand";) rátettem a hand kurzort de akkor is átvált minden egyes háttérváltoztatásnál :S
valami más ötlet hogy ezt kiküszöböljem?
(UI: azért villogott neked FF2 ben is mert még nem töltte be az egyes képeket, de ezt egy elrejtett div-vel oldottam meg)
7

félig megoldva

Somnus · 2007. Május. 29. (K), 22.04
document.getElementById(id).style.cursor="pointer";
document.getElementById(id).style.cursor="hand";
ezekkel stabilizáltam (naggyából) a sima pointerre való ugrást :S
vélemény?
8

villódzik még mindig

Fraki · 2007. Május. 30. (Sze), 04.07
Nekem ugyanúgy villódzik, mint korábban. IE6-ban csak a kurzor, FF2-ben az egész (ha rajtahagyom, nem hagyja abba).

Nekem is volt ilyen problémám, méghozzá nem is képpel, hanem simán csak háttérszín-váltással, ahol egymásba foglalt blokkok közül az egyik felvette az eseményeket, és egy szülőeleme változott. Itt is ez a helyzet: az eseményeket az IMG-hez kötöd, a változás pedig egy 3-mal feljebbi konténerében történik. Valószínűleg nem a böngészők a hibásak, hanem a DOM eseménymodelljéből fakad a dolog. (Remélem, nem mondtam hülyeséget.)

A pointer-hand trükközésnek nincs értelme, a pointer a valid, és minden böngésző ismeri (és mindegy, hogy melyik elemet stilizálod vele).

Megpróbálhatod, hogy az eseményeket a konténerdiv-hez kötöd.

De az említett késleltetős workarounddal nagyon jól lehet kezelni ezt a dolgot. Az onmouseout-ot meghagyod úgy ahogy van, csak köré írod, hogy

defer = setTimeout(function() { /* az onmouseout kódja */ }, 100)


Az onmouseover elejére pedig beírod:
clearTimout(window.defer || 0);
9

kiegészítés

Fraki · 2007. Május. 30. (Sze), 04.21
Eleinte kísérletezhetsz 100 helyett nagyobb értékkel, hogy lásd, biztosan működik, majd viszed lejjebb. De 100-nál azért már mennie kéne: ennyi idő alatt biztosan lefut a következő eseményciklus, és törlődik a mouseout időzítője.

Most viszont az jutott eszembe, hogy itt folyamatos változásról van szó, ezért fontos lehet, hogy ha a clearTimeout sikeres, akkor ne fusson le újra az onmouseover. Azaz:

onmouseout
-----------
defer = setTimeout(function() {
   /* az eredeti onmouseout kódja */
   ...
   defer = false;
}, 100)


onmouseover
-----------
if (window.defer) {
  clearTimout(defer);
  return;
}
10

nemtudom...

Somnus · 2007. Május. 30. (Sze), 07.46
beleírtam a function-okba azokat amiket mondtál de ígysem jó, vagy rossz helyre írtam azis lehet, meglesnéd a forrását ha szépen megkérlek?
lehet hogy maradok inkább a gifes megoldásnál, vagy flessben :)
amúgy js-hez lövésem sincs, csak itt ott olvasgattam róla :S
11

Nem sikerült

Fraki · 2007. Május. 30. (Sze), 14.56
Nem sikerült összehoznom, bonyodalmas tényleg az állandó képcsere miatt. Sajnos nálam FF2-ben úgy is villódzik, ha semmilyen eseménnyel nem kavarok, csak hagyom futni az animációt.

Flashsel célszerűbb valóban.

De valahol esetleg megtarthatnád, hátha érez valaki egy kis challenge-et.
12

css

demo · 2007. Május. 30. (Sze), 15.18
én css-t javaslom ...
... itt érdemes nézelődni.

http://users.hszk.bme.hu/~hj130/css/list_menu/index.html
13

hát hallod én is

Fraki · 2007. Május. 30. (Sze), 17.21
csak kérdés, hogy az animált nyílhoz a css4-ig vagy a css5-ig kell csak várni.
14

sztem kiírom az oldalra csak ie7, ff és opera kompatibilis xD

Somnus · 2007. Május. 30. (Sze), 18.39
na szal itt: http://www.xs4all.nl/~peterned/ találtam valami okosságot villogás ellen, de az egér ugyanúgy ugrál :S
a css-es megoldás meg nem egérkurzorra ment gondolom mert azon az oldalon nem találtam semmit egérhez.
az egerem ugyanúgy villog mintaz állat xD
az a gondolatmenet jóvolt hogy késleltetni az onmouseovert és onmouseoutot csak valahogy nemtudtam eljutni a megvalósításig :P sztem az kavar be főleg hogy ha egyik gombról a másikra ugrok egyből akkor nemtud visszaváltani az időzítés miatt :S ami viszont elég gáz.
szal még most sem vok előrébb, valszínű kiírom hogy ie7 ff2 opera8 ns nemtomhanyas kompatibilis oszt csá!
ezesetleg még olyat hogy ie6 bug miatt villog az egér használj firefoxot :) (bár nemszeretem tüzesrókát, maxthont használok)