| Autor | Zpráva | ||
|---|---|---|---|
| kryber Profil * |
#1 · Zasláno: 11. 4. 2010, 04:01:02
Dobrý den,
mám dotaz: potřebuji, aby obrázek povyjel při mouseover, a odjel zpět při mouseout. Do tohoto Objektu ale potřebuji vložit ještě text. Text je tam vložen pomocí divu. Mám problém, že při přejetí myši přes text, který je obsažený v mém objektu, dojde v momentě k narušení hranice objektu a tím pádem k znovu načtená funkce. To má za následek, že se pak obrázek hýbe stále dokola (v případě že nechám myš na tomto objektu). Myslíte že to lze nějak vyřešit? Předem děkuji za odpověď <style> .shadow_button { position:relative; top:50px;} .footer_head {position:absolute; left:6; top:6; color:#FFF; width:200px; text-align:center; z-index:2 } #shadow_button1 {position:absolute; left:50px;top:100px; z-index:1} #shadow_button2 {position:absolute; left:250px;top:100px;z-index:3} #shadow_button3 {position:absolute; left:450px;top:100px; z-index:4} #shadow_button4 {position:absolute; left:650px;top:100px; z-index:5} #shadow_button5 {position:absolute; left:850px;top:100px; z-index:6} </style> <script src="jquery.js"></script> </head> <body style="background:#003b57"> <div class="shadow_button"> <div id="shadow_button1"><span class="footer_head">Makak</span><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button2"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button3"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button4"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button5"><img src="images/makak.png" width="212" height="160" alt="makak"></div> </div> <script> $("#shadow_button1").mouseover(function(){ $("#shadow_button1").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button1").mouseout(function(){ $("#shadow_button1").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button2").mouseover(function(){ $("#shadow_button2").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button2").mouseout(function(){ $("#shadow_button2").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button3").mouseover(function(){ $("#shadow_button3").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button3").mouseout(function(){ $("#shadow_button3").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button4").mouseover(function(){ $("#shadow_button4").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button4").mouseout(function(){ $("#shadow_button4").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button5").mouseover(function(){ $("#shadow_button5").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button5").mouseout(function(){ $("#shadow_button5").animate({"top": "+=50px"}, "slow"); }); </script> |
||
| kryber Profil * |
#2 · Zasláno: 11. 4. 2010, 04:02:21
<style>
.shadow_button { position:relative; top:50px;} .footer_head {position:absolute; left:6; top:6; color:#FFF; width:200px; text-align:center; z-index:2 } #shadow_button1 {position:absolute; left:50px;top:100px; z-index:1} #shadow_button2 {position:absolute; left:250px;top:100px;z-index:3} #shadow_button3 {position:absolute; left:450px;top:100px; z-index:4} #shadow_button4 {position:absolute; left:650px;top:100px; z-index:5} #shadow_button5 {position:absolute; left:850px;top:100px; z-index:6} </style> <script src="jquery.js"></script> </head> <body style="background:#003b57"> <div class="shadow_button"> <div id="shadow_button1"><span class="footer_head">Makak</span><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button2"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button3"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button4"><img src="images/makak.png" width="212" height="160" alt="makak"></div> <div id="shadow_button5"><img src="images/makak.png" width="212" height="160" alt="makak"></div> </div> <script> $("#shadow_button1").mouseover(function(){ $("#shadow_button1").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button1").mouseout(function(){ $("#shadow_button1").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button2").mouseover(function(){ $("#shadow_button2").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button2").mouseout(function(){ $("#shadow_button2").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button3").mouseover(function(){ $("#shadow_button3").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button3").mouseout(function(){ $("#shadow_button3").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button4").mouseover(function(){ $("#shadow_button4").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button4").mouseout(function(){ $("#shadow_button4").animate({"top": "+=50px"}, "slow"); }); $("#shadow_button5").mouseover(function(){ $("#shadow_button5").animate({"top": "+=-50px"}, "slow"); }); $("#shadow_button5").mouseout(function(){ $("#shadow_button5").animate({"top": "+=50px"}, "slow"); }); </script> |
||
| fajzen Profil |
#3 · Zasláno: 11. 4. 2010, 10:21:37
kryber:
skús namiesto mouseover použiť mouseenter a namiesto mouseout mouseleave |
||
| Kryber Profil * |
#4 · Zasláno: 11. 4. 2010, 11:14:00
fajzen:
Mnohokrát děkuju !!! Moc mi to pomohlo ! Abys viděl, kde to bude použito, tak pak koukni na www.602.cz, zítra :) Děkuji ještě jednou. |
||
| fajzen Profil |
#5 · Zasláno: 11. 4. 2010, 18:35:56
Kryber:
za málo, zajtra kuknem |
||
|
Časová prodleva: 14 let
|
|||
0