<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>jQuery图片放大变小切换代码 - 网页模板</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.banner.js"></script>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}
.banner{width:100%;overflow:hidden;height:470px;position:relative}
.banList{position:absolute;left:50%;margin-left:-960px;height:470px}
.banList li{height:470px;opacity:0;position:absolute;transform:scale(0);transition:transform 0.5s ease 0s, opacity 1.5s ease 0s;z-index:1;}
.banList li.active{opacity:1;transform:scale(1);z-index:2;}
.fomW{position:absolute;bottom:20px;left:50%;height:20px;z-index:9;width:1000px;margin-left:-500px}
.jsNav{text-align:center;}
.jsNav a{display:inline-block;background:#fff;width:15px;height:15px;border-radius:50%;margin:0 5px;}
.jsNav a.current{background:#fc8f0f;cursor:pointer}
</style>
</head>
<body>
<div class="banner">
<ul class="banList">
<li class="active"><a href="http://www.moobnn.com/"><img src="images/img1.jpg"/></a></li>
<li><a href="http://www.moobnn.com/"><img src="images/img2.jpg"/></a></li>
<li><a href="http://www.moobnn.com/"><img src="images/img3.jpg"/></a></li>
</ul>
<div class="fomW">
<div class="jsNav">
<a href="javascript:;" class="trigger current"></a>
<a href="javascript:;" class="trigger"></a>
<a href="javascript:;" class="trigger"></a>
</div>
</div>
</div>
<script type="text/javascript">
$(function(){
$(".banner").swBanner();
});
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>
jQuery图片放大变小切换代码.zip
版权申诉
18 浏览量
2022-11-22
17:15:48
上传
评论
收藏 240KB ZIP 举报
jQuery图片放大变小切换代码.zip （8个子文件） 
jQuery图片放大变小切换代码 
jQuery图片放大变小切换代码.jpg 40KB jiaoben3663 images img1.jpg 91KB img2.jpg 55KB
Thumbs.db 7KB img3.jpg 53KB
index.html 2KB js jquery.js 98KB jquery.banner.js 1KB资源评论
芝麻粒儿
- 粉丝: 5w+
- 资源: 2万+
