JS过渡和变形效果演示(举例:鼠标滑过图片放大) --JS案例


1、代码:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS过渡和变形效果演示</title>
  <style type="text/css">
    *{
      margin: 0;
      padding: 0;
    }
    .container{
      width: 158px;
      height: 183px;
      margin: 0 auto;
      border:1px solid #fad282;
      overflow: hidden;
    }
    .container img{
      transition: all 1.2s ease;
    }
    .container img:hover{
      transform: scale(1.2);
    }
  </style>
</head>
<body>
  <div class="container">
    <img src="html5.png" alt="html5.png">
  </div>
</body>
</html>

2、演示:http://www.nxl123.cn/bokeyuan/2018080201/

(滑过前)

(滑过时,图片放大)


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM