简单的banner幻灯片
分类:代码 日期: 点击(8,673) 下载(0) 来源:未知
这是一个常见的、简单的、易用的幻灯片,没有过多的修饰,比较百搭,喜欢的话就下载使用吧。该幻灯片兼容所有浏览器,包括 IE6。
使用方法
引入文件
<link rel="stylesheet" href="css/slideshow.css"> <script src="js/slideshow.js"></script>
HTML
<div class="comiis_wrapad" id="slideContainer"> <div class="frame cl" id="frameHlicAe"> <div class="temp"></div> <div class="block"> <div class="cl"> <ul class="slideshow" id="slidesImgs"> <li> <a href="###" target="_blank"> <img src="images/1.jpg" alt="" /> </a> <span>第1张图的描述信息</span> </li> <li> <a href="###" target="_blank"> <img src="images/2.jpg" alt="" /> </a> <span>第2张图的描述信息</span> </li> …… <li> <a href="###" target="_blank"> <img src="images/10.jpg" alt="" /> </a> <span>第10张图的描述信息</span> </li> </ul> </div> <div class="slidebar" id="slideBar"> <ul> <li class="on">1</li> <li>2</li> …… <li>10</li> </ul> </div> </div> </div> </div>
JavaScript
SlideShow(3000);
3000 为每次切换的间隔,可任意更改。数字导航的位置可更改对应的 CSS。
标签:幻灯片
相关文章
-
ck_slide – 简单的jQuery幻灯片插件
-
Pogo Slider – jQuery幻灯片插件
-
纯CSS实现的图片轮播
-
jQuery仿IBM首页带缩略图幻灯片效果
-
jQuery定时幻灯片插件Timeliner
-
jQuery幻灯片插件slick
-
Ideal Image Slider – 简单的纯JS幻灯片
-
jQuery幻灯片插件Sudo Slider
-
FlexSlider制作新浪2014成都车展幻灯片
-
制作网易2014巴西世界杯专题幻灯片
-
jQuery仿Google Play幻灯片效果插件plusview
-
jQuery幻灯片插件Orbit
-
响应式动画效果博客幻灯片
-
Swiper制作《FIFA足球世界》游戏特色幻灯片
-
Swiper制作魅族官网大气幻灯片/轮播图