JS之显示和隐藏二维码

最新推荐文章于 2022-09-06 22:30:40 发布

weixin_30539625

最新推荐文章于 2022-09-06 22:30:40 发布

阅读量224

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/creazybeauty/p/8056777.html

版权

目的：

鼠标放到a链接上，显示二维码(添加show类名，去掉hide类名)

鼠标移开a链接，隐藏二维码(添加hide类名，去掉show类名)

代码如下：

<body>
<div class="nodeSmall" id="node_small">
<a href="#"></a>
<div class="erweima hide" id="er">
<img src="../images/456.png" alt=""/>
</div>
</div>

<script type="text/javascript">
//需求：鼠标放到a链接上，显示二维码(添加show类名，去掉hide类名)
//      鼠标移开a链接，隐藏二维码(添加hide类名，去掉show类名)
//      步骤：
//      1.获取事件源和相关元素
var a = document.getElementsByTagName("a")[0];
var div = document.getElementsByClassName("erweima")[0];
//      2.绑定事件
a.onmouseover = function fn1(){
 div.className = "erweima show";

}
a.onmouseout = function fn2(){
    div.className = "erweima hide";
}
//      3.书写事件绑定程序

</script>
</body>

转载于:https://www.cnblogs.com/creazybeauty/p/8056777.html

weixin_30539625

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS之显示和隐藏二维码

目的：鼠标放到a链接上，显示二维码(添加show类名，去掉hide类名)鼠标移开a链接，隐藏二维码(添加hide类名，去掉show类名)代码如下：<body><div class="nodeSmall" id="node_small"><a href="#"></a><div class="erweima hid...
复制链接

扫一扫