mouseover bij imagemap.
ik heb een imagemap gemaakt, als ik over een gezicht heen ga op de foto moet er een tekst in een div aangepast worden, maar het werkt niet :(
ik heb een aantal area tags..
één ervan heeft een id (id="Ellen")
nu heb ik dit als JQuery code:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<script>
$("#Ellen").mouseover(function() {
$("#slotwoord").text("hallo allemaal!");
});
</script>
$("#Ellen").mouseover(function() {
$("#slotwoord").text("hallo allemaal!");
});
</script>
en uiteraard een div met id="slotwoord"
met daarin de tekst.. "ga over één van de gezichten om te kijken wat ze zeggen"
kan iemand mij helpen?
Gewijzigd op 08/08/2011 16:00:50 door - Ariën -
alles staat er goed in...
ik heb dus <area id="Ellen" />
(plus alle coördinaten enzo...)
Gewijzigd op 08/08/2011 17:50:58 door Eric Wagener
helaas, dat werkt ook niet :(
hier de volledige code..
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<script type="text/javascript">
$("#Ellen").mouseover(function() {
$("#slotwoord").html("hallo allemaal!");
});
</script>
$("#Ellen").mouseover(function() {
$("#slotwoord").html("hallo allemaal!");
});
</script>
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div id="slotwoord"></div>
<img src="images/Groepsfoto.jpg" alt="Groepsfoto" usemap="#imagemap" />
<map id="imagemap" name="imagemap">
<area id="Ellen" alt="Ellen Jager" coords="383,23,456,124" href=""/>
</map>
<img src="images/Groepsfoto.jpg" alt="Groepsfoto" usemap="#imagemap" />
<map id="imagemap" name="imagemap">
<area id="Ellen" alt="Ellen Jager" coords="383,23,456,124" href=""/>
</map>
een alert werkt ook niet, ik heb nu even een klein rood divje geplaatst, en die het id="Ellen" gegeven, ook dat werkt niet...
Toevoeging op 08/08/2011 19:04:53:
kan iemand me hiermee helpen ???
Toevoeging op 08/08/2011 19:21:24:
na lang zoeken heb ik het gevonden...
het JQuery gedeelte moest ik net voor de sluitende </body> tag zetten...
Gewijzigd op 08/08/2011 19:21:39 door Jason van der Zeeuw
Code (php)
1
2
3
4
5
2
3
4
5
$(document).ready(function() {
$("#Ellen").mouseover(function() {
$("#slotwoord").html("hallo allemaal!");
});
});
$("#Ellen").mouseover(function() {
$("#slotwoord").html("hallo allemaal!");
});
});
Dan kan het gewoon in de header of in een externe .js staan.
Code (php)
1
$(document).ready(function() {
Code (php)
1
$(function(){
Deze twee regels (de tweede is exact hetzelfde als de eerste!) zorgen ervoor dat de code die hierin staat, pas wordt uitgevoerd op het moment dat de DOM klaar is met laden/renderen van de pagina.
Weetje toevallig wat het equivalent is van "$(document).ready(function() {" in normaal javascript?
Als je meerdere javascript functies op 1 pagina hebt is het dan de bedoeling dat je "$(document).ready(function() {" om iedere functie zet, of zet je alle functies binnen "$(document).ready(function() {" ?