jQuery团结Css2与Css3实现的图片放大结果

发布时间：2018-08-18 15:45:10 所属栏目：编程来源：站长网

导读：jQuery 团结Css2与Css3实现的图片放大结果，鼠标移上后的图片放大殊效，不是纯粹意义上的图片放大，严酷来说是一款鼠标结果，当把鼠标放在图片上的时辰，图片会稍稍变大，与原本的巨细纷歧样，为网页增进一些动感的格调，整体结果做的挺大度，这里用函数直

　　jQuery团结Css2与Css3实现的图片放大结果，鼠标移上后的图片放大殊效，不是纯粹意义上的图片放大，严酷来说是一款鼠标结果，当把鼠标放在图片上的时辰，图片会稍稍变大，与原本的巨细纷歧样，为网页增进一些动感的格调，整体结果做的挺大度，这里用函数直接加载:hover，停止了图片放大太过不流通的弱点。

　　猛火编辑提醒：代码中有两种例子，个中CSS3的结果必需在IE9/Chrome/Firefox等赏识器查察。

　　为办理一些网页殊效运行后不能表现结果（譬喻：jQuery则必要革新）题目，猛火出格新增网页版演示。

　　点击查察：网页殊效

　　运行演示：

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> <title>JS图片放大殊效</title> <script src="/uploads/common/js/jquery-1.4.2.min.js"></script> <script language="javascript">  </script> <style>  </style> </head> <body> <p align="center">ZoomIn Jquery+CSS2 </p> <div id="zoom0"> <div id="pic1"><img src="/uploads/common/images/wall_s1.jpg" /></div> <div id="pic2"><img src="/uploads/common/images/wall_s2.jpg" /></div> <div id="pic3"><img src="/uploads/common/images/wall_s3.jpg" /></div> </div> <p align="center">ZoomIn CSS3</p> <div id="zoom1"> <div id="pic1"><img src="/uploads/common/images/wall_s1.jpg" /></div> <div id="pic2"><img src="/uploads/common/images/wall_s2.jpg" /></div> <div id="pic3"><img src="/uploads/common/images/wall_s3.jpg" /></div> </div> </body> </html> <div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>
提醒：可修改儿女码再运行!

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

MYSQL_框架之主从GTID	MySQL Online DDL的实
MySQL 5.7 mysqldumps	MySQL TEXT、DATE、SE