仿主题广告轮播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 ...
随机推荐
- HTTP协议分析及攻防方法
HTTP协议简介 应用层协议,无状态协议(可设定为维持TCP连接,但服务器端的资源会释放).默认HTTP的端口号为80,HTTPS的端口号为443. 基于HTTP协议的客户机访问包括4个过程,分别是建 ...
- strtok
1. Int main(void) { char *tmp = NULL; Char *remotebuf=”0\r\n”; tmp = strtok(remotebuf, DELIM); ...
- 对apache和memcache进行压力测试
工作中经常使用的软件之二:apache和memcache 以前经常听说memcache的TPS能达到几万,但一直也不知道apache的性能到底如何,所以在闲暇之余,就自己做了一下压力测试. 环境:两台 ...
- Datatable转换成List实体对象列表 几个实例
一, /// <summary> /// 将Datatable转换为List集合 /// </summary> /// <typeparam name="T&q ...
- Curl之Post Json
curl Post Json $ curl -i -X POST -H "'Content-type':'application/x-www-form-urlencoded', 'chars ...
- 2013 ACM/ICPC Asia Regional Changsha Online–C (模拟)
题目描述 略... 题解 注意控制精度即可....变量全部定义成double,结果round就行....妈蛋....被这题目恶心死了.... 代码: #include <iostream> ...
- GiftWrapping算法解决二维凸包问题
一.问题描述 凸集(Convex Set): 任意两点的连线都在这个集合内的集合就是一个凸集. ⒈对于一个集合D,D中任意有限个点的线性组合的全体称为D的凸包. ...
- hdu3394--Railway(点的双连通分量)
一个公园中有 n 个景点,景点之间通过无向的道路来连接,如果至少两个环公用一条路,路上的游客就会发生冲突:如果一条路不属于任何的环,这条路就没必要修 问,有多少路不必修,有多少路会发生冲突 每一个连通 ...
- poj1087 A Plug for UNIX & poj1459 Power Network (最大流)
读题比做题难系列…… poj1087 输入n,代表插座个数,接下来分别输入n个插座,字母表示.把插座看做最大流源点,连接到一个点做最大源点,流量为1. 输入m,代表电器个数,接下来分别输入m个电器,字 ...
- 部署ActiveMQ的Share File System Master-Slave
之前在项目里用MQ是用单节点,因为业务量不大没有主从.这样风险很大,会有单点问题.新项目起来了,需要一个高可用的MQ,故研究了下AMQ的几种master-slave方式: 1.Pure Master- ...