标签：jquery-effects css3 animation javascript jquery
可以使用jQuery背景位置动画重现类似效果的缩放图像吗？
像这样：http://www.sohtanaka.com/web-design/examples/image-zoom/
我的意思是,而不是设置图像大小的动画(这很麻烦,因为浏览器会严重调整图像的大小),而是通过在链接上设置背景图像来制作动画,并对链接的位置和大小进行动画处理.
编辑：
一个想法是使用两个图像.例如：
>两张重叠的图像,一个200 x 200像素,另一个400 x 400像素
>仅第一个图像可见,第二个图像隐藏在第一个图像之后,并调整为200 x 200
>用户将鼠标悬停在上面,然后第一张图像放大到400 x 400,并同时淡出
>第二张图像逐渐淡入并同时放大到其原始大小(400 x 400)
可以用jquery来实现吗？
解决方法:
的CSS
#div{
background: url('http://images.epilogue.net/users/sirgerg/phoenix_nebula.jpg') top no-repeat;
background-size: 10%;
height: 490px;
width: 490px;
}
JS
$('#div').hover(function (){
$(this).animate({
'background-size': '50%'
})
}, function (){
$(this).animate({
'background-size': '10%'
})
})
的HTML
<div id="div"></div>
描述：仅适用于最新的Chrome
参考：Set size on background image with CSS?
标签：jquery-effects,css3,animation,javascript,jquery 来源： https://codeday.me/bug/20191208/2092334.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。