首页顶部图片轮播效果

首页顶部焦点图片轮播效果
演示效果.jpg

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body id="index">
<link type="text/css" rel="stylesheet" href="lunbotu.css">
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="jquery.easing.js"></script>
<script type="text/javascript" src="index.js"></script>
<div id="banner">
  <ul style="width: 300%; left: 0%;">
<li style="width: 33.3333%; background-image: url(01.jpg);"><a href="#"></a></li>
<li style="width: 33.3333%; background-image: url(02.jpg);"><a href="#"></a></li>
<li style="width: 33.3333%; background-image: url(03.jpg);"><a href="#"></a></li>
  </ul>
  <div class="banner-controller" data-selector="bannerController"><a href="javascript:;" data-index="0" class="current"></a><a href="javascript:;" data-index="1" class=""></a><a href="javascript:;" data-index="2" class=""></a></div>
</div>
</body>
</html>

源码下载：

轮播效果.rar (552.07 KB, 下载次数: 599)

灰儿 · 发表于 2016-4-1 10:55:59

SuperSlide:集合TAB选项卡、焦点图、无缝滚动的jQuery万能代码

SuperSlide 是致力于实现网站统一特效调用的函数，能解决大部分标签切换、焦点图切换等效果，还能多个slide组合创造更多的效果。（兼容ie内核(包括无敌的ie6)、webkit内核、ff、opera等主流浏览器）。

v1.2版本更新说明：

Super Slide 从v1.2开始正式更名为 SuperSlide（无空格）！js文件命名正式更名为：jquery.SuperSlide.js
新增参数autoPage -- 系统自动分页，兼容1.0，覆盖1.0版本代码即可。
修复无缝滚动（leftMarquee、topMarquee）在xp系统下，ie7、ie8无法滚动的神奇bug
新增多个效果展示！带有new的都是新增的效果，其实这些效果1.0也可以实现的，但有些同志可能没有深入了解SuperSlide，不知道还能这样。新增的都是一些常见效果，希望对你有启发。

更多样式：
http://www.17sucai.com/pins/demoshow/2637

http://down.admin5.com/demo/code_pop/18/562/

http://www.5icool.org/demo/2012/a00744/