Problème Javascript / CSS
Bonjour,
je viens vous faire part d'un petit soucis...
J'ai mon code HTML qui comporte une <div id="neko"></div> avec un background-image dans la feuille de style.
Au chargement de la page, l'image apparaît parfaitement.
Je veux aller plus loin et changer le background-image lors d'un évènement.
j'utilise donc le code suivant :
<!-- j'importe la bibliothèque JQuery -->
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
<!-- Ensuite je change la div comme ceci -->
<script type="text/javascript">
$("neko").css("background-image", "url('Error.png')");
alert ("Une erreur est survenu....");
</script>
---------------------------------------------------------------------------------
le message d'alerte me sert à vérifier que le script s'effectue. En effet, j'ai bien le message d'alerte mais l'image ne change pas... Où me suis-je donc trompé ?
Si quelqu'un aurait une solution, je l'en remercie grandement.
Cordialement
je viens vous faire part d'un petit soucis...
J'ai mon code HTML qui comporte une <div id="neko"></div> avec un background-image dans la feuille de style.
Au chargement de la page, l'image apparaît parfaitement.
Je veux aller plus loin et changer le background-image lors d'un évènement.
j'utilise donc le code suivant :
<!-- j'importe la bibliothèque JQuery -->
<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
<!-- Ensuite je change la div comme ceci -->
<script type="text/javascript">
$("neko").css("background-image", "url('Error.png')");
alert ("Une erreur est survenu....");
</script>
---------------------------------------------------------------------------------
le message d'alerte me sert à vérifier que le script s'effectue. En effet, j'ai bien le message d'alerte mais l'image ne change pas... Où me suis-je donc trompé ?
Si quelqu'un aurait une solution, je l'en remercie grandement.
Cordialement
8 réponses
-
Bonjour
$("#neko")et non pas$("neko"). -
Merci de ta réponse le père. J'ai bien essayé en remplaçant par $("#neko").. Malheureusement aucun changement... L'image reste la même.
-
Je trouve curieux que tu n'utilises que des liens relatifs :
src="jquery.js" et url('Error.png')
Es-tu sûr que tes fichiers sont bien accédés ? Il ne ne manque pas l'indication du chemin d'accès ? -
Non le fichier Jquery est bien dans le dossier racine ainsi que le fichier Error.png
Cependant le background de la div neko a un autre chemin dans la feuille de style :
#neko {
height : 400px;
width: 200px;
background-image : url(img/neko.png);
background-repeat : no-repeat;
}
je voudrais pouvoir utiliser JS pour changer le background-image en :
background-image : url(Error.png);
le fichier Error.png fait exactement les mêmes dimension et se trouve dans le dossier racine. J'ai essayé en plaçant le fichier dans le dossier 'img' : le résultat ne change pas... -
Si tu fais simplement
$("#neko").text("coucou")
ça affiche bien coucou dans ton div ? -
toujours rien... pas de texte qui s'affiche dans la div... Je ne comprends vraiment plus là :(
-
Je viens de faire plusieurs test et en fait, le texte "coucou" s'affiche lorsque je place le code JS après la div "neko". par contre je n'arrive pas à saisir la logique...
-
Si ça affiche bien le alert et pas le coucou, c'est que ta bibliothèque jquery est mal importée.
Si tu utilises Chrome, je peux t'expliquer comment vérifier avec la console à quelle url il va vraiment la chercher.
