问:当鼠标悬停在图片上时,我想在div中更改图片。我希望它与jQuery一起使用。(我知道,使用CSS会容易得多。)
我的HTML看起来像这样:
< div class = “ col-sm-3” >
< b class = “ glyphicon glyphicon-tree-conifer” > </ b > < h2 > Nadelbäume。
</ h2 > < img src = “ img / Planten.jpg” id = “ Planten” > < img src = “ img / rabe.jpg” id = “ rabe” > </ div > <!-class col ende- ->
(是的,我正在使用Bootstrap框架。:))
jQuery看起来像这样:
console.log(“ halo”);
$(“#rabe”)。hide();
$(“ #Planten”).hover(function(){
$(this).show(“#rabe”);
}
);
(console.log仅用于向我显示脚本是否已加载。)
标识为“ rabe”的img被隐藏,因为如果没有,它将显示在标识为“ Planten”的img下。
在此先感谢您的帮助。
答:$ ('img' )。上('的mouseenter' , 函数(){
$ (本)。ATTR ('SRC' ,'IMG / rabe.jpg' ); })。上('鼠标离开' ,函数(){ $ (本)。ATTR ('SRC' ,'IMG / Planten.jpg' ); });
您只需要一个img即可完成此工作,然后在悬停时交换src值(我使用mouseenter / leave而不是悬停)。