jQuery鼠标悬停图片由中心点逐渐放大效果
博客专区 > ycYinG 的博客 > 博客详情
jQuery鼠标悬停图片由中心点逐渐放大效果
ycYinG 发表于10个月前
jQuery鼠标悬停图片由中心点逐渐放大效果
  • 发表于 10个月前
  • 阅读 3
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云实验室 1小时搭建人工智能应用,让技术更容易入门 免费体验 >>>   

####html代码

<img src=“xxx.jpg" class="pic" />
####css代码 *{ margin:0; padding:0; list-style:none;} .box{ width:250px; height:321px; margin:100px auto; position:relative;} img{ position:absolute; left:0; top:0; cursor:pointer;} ####js代码 $(function(){ pic_width = $('.pic').width(); pic_height = $('.pic').height(); pic_width2 = pic_width + 20; pic_height2 = pic_height + 20; $('.pic').hover(function(){ $(this).stop().animate({height:pic_height2,width:pic_width2,left:"-10px",top:"-10px"},500); },function(){ $(this).stop().animate({height:pic_height,width:pic_width,left:"0px",top:"0px"},500); }); });

共有 人打赏支持
粉丝 0
博文 10
码字总数 4889
×
ycYinG
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: