html部分

<a href="" id="pta"><div id="picture" class="pt"></div></a>a标签包裹着div,背景图片作为链接

script部分

var n=-1;//n作为全局变量放在外面,否则每次刷新n的值都是-1
function pt(){
var tp=new Array('url(../bank/picture/1111.jpg)','url(../bank/picture/2222.jpg)','url(../bank/picture/3333.jpg)','url(../bank/picture/4444.jpg)')
var adiv=new Array('http://www.bankofchina.com/pbservice/bi3/201701/t20170124_8524721.html','http://www.bankofchina.com/pbservice/pb7/','http://www.bankofchina.com/pbservice/pb8/','http://www.bankofchina.com/cbservice/cb11/')
var picture=document.getElementById('picture')
var pta=document.getElementById('pta')
n+=1
e=n%tp.length;
pta.setAttribute('href',adiv[e])
picture.style.background=tp[e]
setTimeout('pt()',3000)
}
pt()

js图片轮播的更多相关文章

  1. js图片轮播效果实现代码

    首先给大家看一看js图片轮播效果,如下图 具体思路: 一.页面加载.获取整个容器.所有放数字索引的li及放图片列表的ul.定义放定时器的变量.存放当前索引的变量index 二.添加定时器,每隔2秒钟i ...

  2. JS图片轮播[左右轮播

    直接可以用,网上摘下来的! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  3. js 图片轮播简单版

    <html> <head> <meta charset="utf-8" /> <title></title> <s ...

  4. js 图片轮播(一)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. js 图片轮播代码编辑

    图片轮播,将几张图片统一放在展示平台 banner上,通过banner移动将图片轮流播放. <script>// 取对象 var btn_l = document.getElementsB ...

  6. Js 图片轮播渐隐效果

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. 非常简洁的js图片轮播

    <div id="tupian"></div><script>var jpg =new Array();jpg[0]="url(c.j ...

  8. js图片轮播图

    /*焦点图*/        var Box='.carousel';//盒子        var Menu=$(Box+' .l_cursor li');//圆点菜单        var Con ...

  9. angular js 图片轮播

    搬运工: eg1: Build a Sweet AngularJS Photo Slider Pt 2 with ngTouch DEMO:http://paul-xiao.github.io/ang ...

  10. 最简单的JS图片轮播

    var arr=new Array(); arr[1]="";//放图片地址 arr[2]=""; arr[3]=""; var no=0; ...

随机推荐

  1. CoreAnimation 目录

    CoreAnimation 目录 CoreAnimation 开篇 CoreAnimation 寄宿图 CoreAnimation 图层几何学 CoreAnimation 视觉效果

  2. iOS网络编程笔记——Socket编程

    一.什么是Socket通信: Socket是网络上的两个程序,通过一个双向的通信连接,实现数据的交换.这个双向连路的一端称为socket.socket通常用来实现客户方和服务方的连接.socket是T ...

  3. java操作txt文本(二):删除文本括号内的内容

    想法由来:之前写读书报告时,遇到一些烦人的文献,总喜欢把注释作为括号内容放到正文中,使文章繁琐冗长,所以写了下面这个代码,剔除了括号内的内容. 适用条件:原txt文本中的括号使用正确,即左右括号匹配正 ...

  4. Django ORM模型的一点体会

    作者:Vamei 出处:http://www.cnblogs.com/vamei 严禁转载. 使用Python的Django模型的话,一般都会用它自带的ORM(Object-relational ma ...

  5. 在x64位的操作系统客户端如何连接oracle ?

    好久没更新博客了,上周在x64位的操作系统中安装好了32位或64位的oracle 11g客户端,但用SSIS或Microsoft SQL Server 2012报表生成器3.0去连接oracle 11 ...

  6. 【Unity编程】Unity中关于四元数的API详解

    本文为博主原创文章,欢迎转载,请保留出处:http://blog.csdn.net/andrewfan Unity中关于四元数的API详解 Quaternion类 Quaternion(四元数)用于计 ...

  7. 光环国际的PRINCE2培训是怎么上课的?

    一.面授班级: 基础级:3天知识精讲(含案例分享+现场演练) 上课时间:上午9:00-12:00,下午1:30-4:30分 考试时间:第3天课程结束后5:30-6:30分 1 个小时闭卷考试   专业 ...

  8. MongoDB基础教程系列--第四篇 MongoDB 查询文档

    查询文档 查询文档可以用 find() 方法查询全部文档,可以用 findOne() 查询第一个文档,当然还可以根据 条件操作符 和 $type操作符 查询满足条件的文档. find() 和 find ...

  9. 容易忽略的z-index失效问题

    前些天写一个模仿虎牙网站幻灯片的插件,期间遇到我一直都没注意到的问题,就是z-idnex会失效的问题. 我是将幻灯片的左右按设置为float浮动的,然后在调试点击的时候发现无论怎么调高z-index都 ...

  10. 使用express创建新应用的骨架

    通过应用生成器工具 express 可以快速创建一个应用的骨架. 通过如下命令安装: $ npm install express-generator -g -h 选项可以列出所有可用的命令行选项: $ ...