找回密码
 注册
首页 › ≡≡网络技术≡≡ › WEB前端 ›jquery实现显示隐藏微二维码的方法
返回列表 发新帖

js jquery实现显示隐藏微二维码的方法

灰儿 2016-2-16 09:33:05
代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>显示隐藏微信公众号</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">  
/**
* 显示隐藏二维码
*/
$(document).ready(function(e){
    $(function () {
        $(".er_wma").hide();
        $(".wei_xin").mouseover(function () {
            $(".er_wma").show();
        });
        $(".wei_xin").mouseout(function () {
            $(".er_wma").hide();
        });
    });

});
</script>
<style type="text/css">
.er_wma {
        width: 150px;
        height: 150px;
        position: fixed;
        margin-left: -10px;
        display: none;
        background: url("weixin.jpg") no-repeat;
        background-size: 100% 100%;
}
</style>
</head>
<body>
<span class="wei_xin">微信公众号<div class="er_wma"></div></span>
</body>
</html>
注：
jquery-1.8.3.min.js  代码可从网上下载


回复

使用道具 举报

B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 注册
学习中心
站长自定义文字内容，利用碎片时间，随时随地获取优质内容。
Q设计语言 了解更多
Q Design 提供商家设计所需的指导与资源，帮商家快速完成产品设计、降低生产成本。
学习中心
站长自定义文字内容，利用碎片时间，随时随地获取优质内容。
Q设计语言 了解更多
Q Design 提供商家设计所需的指导与资源，帮商家快速完成产品设计、降低生产成本。
关注管理员之家(admin365.cn)，利用碎片时间，随时随地获取优质内容！
关于我们联系我们商务合作寻求报道投稿须知
意见反馈：lxtdj@163.com
稿件投诉：lxtdj@163.com
7×24小时：18805246622
商务合作：18805246622
内容合作QQ：82931570
客服QQ：82931570

关注我们

关注泗洪热线官方微博
微博账号lxtdj@163.com

关注泗洪热线微信公众号
关注泗洪热线，关注泗洪生活
商务合作、媒体邀约
QQ: 82931570
Copyright © 2021 大湖网络 Powered by 管理员之家 - 苏ICP备2023053177号-2
微信扫一扫