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. JavaScript数据结构——队列的实现

    前面楼主简单介绍了JavaScript数据结构栈的实现,http://www.cnblogs.com/qq503665965/p/6537894.html,本次将介绍队列的实现. 队列是一种特殊的线性 ...

  2. golang mutex互斥锁分析

    互斥锁:没有读锁写锁之分,同一时刻,只能有一个gorutine获取一把锁 数据结构设计: type Mutex struct { state int32 // 将一个32位整数拆分为 当前阻塞的gor ...

  3. 微信公众号java开发思路

    方法一:不开启开发模式,直接在自定义菜单中跳转到网页,适用于流量较小的公众号.   方法二:开启开发者模式,关闭自带的自定义菜单和消息回复,接入自己开发的应用           1.接入校验:创建s ...

  4. PHP之流程的控制

       在一个公司中,员工肯定会有高层.中层和普通员工的,这样如果在某个公司员工遇到某种问题,需要请假.或者提一些请求的时候,就会需要去申请,申请的时候有的是可以直接和上级申请的,有时比较重要的事情,是 ...

  5. python3.6 简单爬虫

    # coding='UTF-8' from bs4 import BeautifulSoup # 引入beautifulsoup 解析html事半功倍 import re import urllib ...

  6. MIT 计算机科学及编程导论 Python 笔记 1

    计算机科学及编程导论在 MIT 的课程编号是 6.00.1,是计算机科学及工程学院的经典课程.之前,课程一直使用 Scheme 作为教学语言,不过由于 Python 简单.易学等原因,近年来已经改用 ...

  7. iOS开发之控制器创建与加载(生命周期)

    1.如何创建一个控制器 控制器常见的创建方式有以下几种: (1)通过storyboard创建 (2)直接创建 MJViewController *mj = [[MJViewController all ...

  8. Java进阶之多线程

    多线程 多线程(multiple thread)是计算机实现多任务并行处理的一种方式. 在单线程情况下,计算机中存在一个控制权,并按照顺序依次执行指令.单线程好像是一个只有一个队长指挥的小队,整个小队 ...

  9. php获取checkbox数组的表单数据

    提交表单的时候,对于checkbox多选框,name="field[]",此时php获取的数组为:从0开始的索引数组:如果name="field[n]" 有数字 ...

  10. 手机自动化测试培训:appium目录结构分析

    手机自动化测试培训:appium目录结构分析   移动端的自动化测试越来越普遍,poptest率先退出移动端自动化测试的课程,以appuim的python脚本版本作为授课基础,后期陆续退出java版本 ...