<!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>鼠标经过显示微信二维码js代码</title>
<style>
*{ margin:0; padding:0; list-style:none}
body{ background:#E6F0F3;}
.weixin{ width:30px; height:30px; margin:100px auto;position:relative; font-size:12px; text-align:center;}
.weixin a{width:30px; height:30px; display:block; position:absolute; left:0; top:0;background:url(images/weixin.png) no-repeat center top; }
.weixin .weixin_nr{width:100px; height:120px; padding:10px; background:#fff; text-align:center; position:absolute; left:-45px; top:45px; display:none;}
.weixin .weixin_nr img{ margin-bottom:5px;}
.weixin .weixin_nr .arrow{ width:0; height:0; border-bottom:10px solid #fff;border-left:10px solid transparent;border-right:10px solid transparent; position:absolute; left:50px; top:-10px;}
.weixin.on .weixin_nr{ display:block;}
.weixin.on a{ background:url(images/weixin.png) no-repeat left bottom;}
</style>
</head>
<body>
<!--代码部分begin-->
<div class="weixin" onmouseover="this.className = 'weixin on';" onmouseout="this.className = 'weixin';">
<a href="javascript:;"></a>
<div class="weixin_nr">
<div class="arrow"></div>
<img src="images/weixin.jpg" width="100" height="100" />
关注官方微信
</div>
</div>
<!--代码部分end-->
</body>
</html>
*
回帖描述:*
链接类型:*
下载链接:*
描述:*
回帖描述:*
链接类型:*
阅读权限:*
下载链接:



聚优部落技术论坛 © 版权所有 鲁ICP备15007479号-6
Copyright(C)web.com, All Rights Reserved.
