基于jQuery实现 图片飞入购物车特效详解编程语言

<div class="end">终点</div> 
<img src="####" class="picture" /> 
  
<script src="####/jquery.min.js"></script> 
<script> 
$(function(){ 
$('.picture').click(function(){ 
var flyElm = $('.lanrenzhijia').clone().css('opacity','0.7'); 
flyElm.css({ 
    'z-index': 9000, 
    'display': 'block', 
    'position': 'absolute', 
    'top': $('.picture').offset().top +'px', 
    'left': $('.picture').offset().left +'px', 
    'width': $('.picture').width() +'px', 
    'height': $('.picture').height() +'px' 
}); 
$('body').append(flyElm); 
    flyElm.animate({ 
    top:$('.end').offset().top, 
    left:$('.end').offset().left, 
    width:50, 
    height:50, 
},'slow'); 
}); 
}); 
</script>

原创文章,作者:Maggie-Hunter,如若转载,请注明出处:https://blog.ytso.com/8541.html

(0)
上一篇 2021年7月18日
下一篇 2021年7月18日

相关推荐

发表回复

登录后才能评论