Changer l'image de fond de la div sur la souris d'un lien
Ce que je veux atteindre
Je veux que l'image de fond de la div à changer sur l'effet de survol d'un lien au sein de la div.
Exemple
<div id="container">
<a href="" id="linktomouseover"></a>
</div>
Ce que j'ai essayé de
J'ai essayé de remplacer le fond de l'image à l'aide de jQuery:
<script language="javascript" type="text/javascript">
jQuery('#linktomouseover').mouseover(function()
{
jQuery('#container').css("background-image", "url(bg-b.png)");
});
</script>
Quelqu'un peut-il me conseiller sur ce que je suis absent?
Solution
<style>
#container{
width:100%;
height:100%;
background-image:url(http://thumbs.dreamstime.com/thumblarge_536/12838649102C1cO5.jpg);
}
</style>
<div id="container"><br><br>
<a href="" id="linktomouseover">hover</a>
</div>
<script>
jQuery('#linktomouseover').hover(function()
{
jQuery('#container').css("background-image",
"url(http://static4.depositphotos.com/1011237/285/i/450/dep_2853473-Background-for-your-web-store.jpg)
");
}).mouseleave(function(){
jQuery('#container').css("background-image", "url(http://thumbs.dreamstime.com/thumblarge_536/12838649102C1cO5.jpg)");
});
</script>
OriginalL'auteur Dominor Novus | 2011-09-10
Vous devez vous connecter pour publier un commentaire.
id manquant=
pas
et aussi de l'interrupteur .cliquez sur ().hover() comme lien dit
http://sandbox.phpcode.eu/g/31e7b/6
Ce n'était pas une raison pour la suppression 🙂 Mais il y a plus d'erreurs que je vois :p
cliquez sur? je pense que tu veux dire passage de la souris ou ai-je raté quelque chose?
whooops, mouseover, oui
Merci pour l'exemple. Il fait le tour. J'ai oublié de mentionner que j'avais besoin de restaurer l'original de l'image de fond sur mouseleave. J'ai ajouté mon code terminé à la question. Merci encore.
OriginalL'auteur genesis
Ce n'est pas la solution, mais vous êtes actuellement pas en cours d'exécution de votre code d'après le modèle de dom est chargé, ce qui signifie probablement que jQuery('#linktomouseover') retourne rien.
Essayez ceci:
Aussi, si vous souhaitez avoir cet effet pour plus d'un lien, vous pouvez le faire comme ceci;
html:
js:
OriginalL'auteur Alxandr