我正在尝试使用jQuery更改div上的div的背景图像。这是我到目前为止提出的,但是,它没有用:
html
<div class="logo"></div>
的CSS
.logo {
width: 300px;
height: 100px;
background: url('http://placehold.it/300x100/ffffff/000000.png&text=first') no-repeat center top;
}
js
$('.logo').hover(
function(){
$(this).animate({backgroundImage: 'http://placehold.it/300x100/ffffff/000000.png&text=second'},'fast');
},
function(){
$(this).animate({backgroundImage: 'http://placehold.it/300x100/ffffff/000000.png&text=first'},'fast');
});
jsfiddle在这里:http : //jsfiddle.net/26j6P/1/
我究竟做错了什么?如果我设置背景颜色的动画,效果很好...
您不能对图像使用jQuery的动画-只是不起作用。
像这样使用普通的CSS ...
这是CSS ...
.logo {
width: 300px;
height: 100px;
background: url('http://placehold.it/300x100/ffffff/000000.png&text=first') no-repeat center top;
transition: 0.5s;
}
.logo:hover {
background-image: url('http://placehold.it/300x100/ffffff/000000.png&text=second');
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句