JavaScript使用面向对象改变透明度的运动

zwt腾

于 2021-09-07 21:02:26 发布

阅读量974

点赞数 2

文章标签： javascript html css

本文链接：https://blog.csdn.net/zwt13976124194/article/details/120166198

版权

有一个有背景颜色的div，我们要改变其透明度，要求不能用html和css来实现，只用js该如何实现呢？下面我用刚学的js中的面向对象跟大家交流一下

一，首先我们先看看用常规的html+css+js的代码

1.html代码：

<body>

  <div id="box">

  </div>

</body>

2.css代码：

<style type="text/css">
  * {
    margin: 0;
    padding: 0;
  }

  div {
    width: 100px;
    height: 100px;
    background: deepskyblue;
    position: absolute;
    left: 200px;
    top: 200px;
    opacity: 0.3;
  }
</style>

3.JavaScript代码：

<script type="text/javascript">
  var obj = document.querySelector("div");

  // 鼠标移入,颜色由浅到深
  obj.onmouseover = function () {
    start(100)；
  }

  // 鼠标移出 颜色由深到浅
  obj.onmouseout = function () {
    start(30)ÿ

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

zwt腾

关注关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript使用面向对象改变透明度的运动

有一个有背景颜色的div，我们要改变其透明度，要求不能用html和css来实现，只用js该如何实现呢？下面我用刚学的js中的面向对象跟大家交流一下一，首先我们先看看用常规的html+css+js的代码1.html代码：<body><divid="box"></div></body>2.css代码：<style type="text/css"> * { margin: 0; paddi...
复制链接

扫一扫