仿主题广告轮播js
function SlideShow(c) {
var a = document.getElementById("slide");
var f = document.getElementById("slide_Img").getElementsByTagName("li");
var h = document.getElementById("slideBar");
var n = h.getElementsByTagName("li");
var d = f.length;
var c = c || 3000;
var e = lastI = 0, j, m;
function b() {
m = setInterval(function () {
e = e + 1 >= d ? e + 1 - d : e + 1;
g()
}, c)
}
function k() {
clearInterval(m)
}
function g() {
f[lastI].style.display = "none";
n[lastI].className = "";
f[e].style.display = "block";
n[e].className = "no";
lastI = e
}
f[e].style.display = "block";
a.onmouseover = k;
a.onmouseout = b;
h.onmouseover = function (i) {
j = i ? i.target : window.event.srcElement;
if (j.nodeName === "LI") {
e = parseInt(j.innerHTML, 10) - 1;
g()
}
};
b()
}
界面:
<div class="slide" id="slide">
<div class="slideImg">
<ul id="slide_Img">
<asp:Repeater ID="Index_PosterCenter1_rpt" runat="server">
<ItemTemplate>
<li><a href="<%#Eval("") %>" style="border: none;" target="_blank" title="">
<img src="SlideImg/slideImg_01.png" style="border: none; width: 510px; height: 250px;"
alt="" />
</a></li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
<div class="slideBar" id="slideBar">
<ul>
<li class="no">1</li>
<% for (int i = 1; i < 4; i++)
{
%>
<li>
<%=i+1 %></li>
<% }%></ul>
<div class="bg">
</div>
</div>
<script type="text/javascript">
SlideShow(3000);
</script>
</div>
网站首页主题图片轮播效果。
仿主题广告轮播js的更多相关文章
- 安卓开发笔记——自定义广告轮播Banner(实现无限循环)
关于广告轮播,大家肯定不会陌生,它在现手机市场各大APP出现的频率极高,它的优点在于"不占屏",可以仅用小小的固定空位来展示几个甚至几十个广告条,而且动态效果很好,具有很好的用户& ...
- android-自定义广告轮播Banner(无限循环实现)
关于广告轮播,大家肯定不会陌生,它在现手机市场各大APP出现的频率极高,它的优点在于"不占屏",可以仅用小小的固定空位来展示几个甚至几十个广告条,而且动态效果很好,具有很好的用户& ...
- android 项目学习随笔十六( 广告轮播条播放)
广告轮播条播放 if (mHandler == null) {//在此初始化mHandler , 保证消息不重复发送 mHandler = new Handler() { public void ha ...
- Android 通过ViewFlipper实现广告轮播功能并可以通过手势滑动进行广告切换
为了实现广告轮播功能,在网上找了很多方法,有的效果很好,但是代码太麻烦,并且大多是用的viewpager,总之不是很满意. 于是看了一下sdk有个控件是ViewFlipper,使用比较方便,于是尝试了 ...
- 自定义View(二)ViewPage广告轮播
自定义View的第二个学习案例,使用ViewPage实现广告轮播,通过组合现有的View实现效果如下: 有关ViewPage使用可以学习谷歌官方API,和训练案例: 1.使用ViewPage实现屏幕滑 ...
- iOS回顾笔记(05) -- 手把手教你封装一个广告轮播图框架
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...
- 网站图片的轮播JS代码
这是几个网站的轮播JS效果,实现图片按照时间来切换,目前有几个站实现该功能,特别是浴室柜网站改版前,以下就是JS具体内容可以自己改下路径就可以用的linkarr = new Array();picar ...
- js轮播功能 标签自动切换 同页面多轮播js
需要加入jquery 1.43及以上版本 下面还有个简单版,一个页面只支持一个轮播 同页面多轮播js <div> <div class="yt_content"& ...
- 纯CSS3跳动焦点广告轮播特效
1. [代码] 纯CSS3跳动焦点广告轮播特效 <!-- Author: Developed by Caleb Jacob Author Website: http://iamceege.co ...
随机推荐
- Installing EF Power Tools into VS2015
TLDR: If you don’t want to do the tasks (even though they are so easy) you can download the updated ...
- SQL Server查询性能优化——覆盖索引(二)
在SQL Server 查询性能优化——覆盖索引(一)中讲了覆盖索引的一些理论. 本文将具体讲一下使用不同索引对查询性能的影响. 下面通过实例,来查看不同的索引结构,如聚集索引.非聚集索引.组合索引等 ...
- oracle to_date函数(转载)
TO_DATE格式(以时间:2007-11-02 13:45:25为例) Year: yy two digits 两位年 ...
- FZU Problem 2125 简单的等式
思路:x绝对小于根号n,再由s(x,m)可以缩小范围.1e9十六进制大约算出每位和相加100左右.这种题直接判断范围再暴力. #include<stdio.h> #include<s ...
- autoSvn
#!/bin/bash dir="/svndata" name="puppet" user="test" passwd="t ...
- CodeForces 540E - Infinite Inversions(离散化+树状数组)
花了近5个小时,改的乱七八糟,终于A了. 一个无限数列,1,2,3,4,...,n....,给n个数对<i,j>把数列的i,j两个元素做交换.求交换后数列的逆序对数. 很容易想到离散化+树 ...
- javascript的类和构造函数
在javascript中,类的实现是基于其原型继承机制的.如果两个实例都从同一个原型对象上继承了属性,我们就说它们是同一个类的实例.那么,如果两个对象继承自同一个原型,那基本上可以认为它们是由同一个构 ...
- 导入excel数据
前提条件:先要安装好EXCEL软件. 程序中经常要用到导入excel数据的功能.其实通过ole操作excel就简单的几行代码,但记性不好,经常要用经常要找, 还是作篇笔记吧. var ExcelApp ...
- python 语句,条件,循环
#coding:utf-8__author__ = 'Administrator'#想要在同一行打印,print后面加','print 12,print 34'''从模块导入函数import some ...
- Python实现二叉树的前序遍历、中序遍历
计算根节点到叶子节点的所组成的数字(1247, 125, 1367)以及叶子节点到根节点组成的数字(7421, 521, 8631),其二叉树树型结构如下 计算从根节点到叶子节点组成的数字,本质上来说 ...