jQuery可展开收缩网页底部广告带二维码特效代码
本帖最后由 小麦子 于 2024-10-26 11:18 编辑以上只是部份演示图片，详细可以付费购买。
<!doctype html>
<!--> <html class="ie7"> <!-->
<!--> <html class="ie8"> <!-->
<!--> <html class="ie9"> <!-->
<!--><!--> <html> <!--<!-->
<head>
<meta charset="utf-8">
<title>jQuery可展开收缩网页底部广告带二维码特效代码</title>
<meta name="keywords" content="jQuery,可展开,收缩,网页底部,广告,二维码,特效代码" />
<meta name="description" content="jQuery可展开收缩网页底部广告带二维码特效代码下载。" />
<meta name="author" content="php" />
<meta name="copyright" content="php" />
<meta name="viewport" id="viewport" content="width=device-width, user-scalable=yes, initial-scale=0.5, maximum-scale=2.0, minimum-scale=0.5"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<script type="text/javascript" src="//xcdn.php.cn/js/ads/jQuery可展开收缩网页底部广告带二维码特效代码/js/jquery-1.10.2.min.js"></script>
<link rel="stylesheet" type="text/css" href="//xcdn.php.cn/js/ads/jQuery可展开收缩网页底部广告带二维码特效代码/css/www.php.cn.css">
</head>
<body>
<!-- 活动角标 -->
<div class="mask">
<span class="closeee"></span>
<a href="#"><span class="clickarea"></span></a>
<div class="thumbnail">
<img src="//xcdn.php.cn/js/ads/jQuery可展开收缩网页底部广告带二维码特效代码/images/d94901eca2cdb9e32862849ccf8fe31f.png">
</div>
</div>
<script>
setTimeout(function(){
$('.thumbnail').trigger('click')
},1000)
// 底部广告栏的收起与展开
$('.thumbnail').on("click", function () {
$(this).animate({"right": -146},400,function () {
$(this).hide();
$('.mask').animate({"left": 0}, 600);
});
});
$('.closeee').on("click", function () {
//var thumbWidth = $('.thumbnail').width();
$('.mask').animate({
"left": "100%"
}, 600, function() {
$('.thumbnail').show().animate({"right": 0},400);
});
});
</script>
</body>
</html>
以上代码中的图片和JS，请下载到自己网站目录中使用！
页:
[1]