图片链接轮换代码, 支持预载
作者：潇洒 来源：潇洒人生 发布时间：2007-10-16 19:57:00
标签：图片,轮换,预载
加班时抽空弄的，javascript图片链接定时轮换，自适应图片大小，支持预载，进行了简单封装，方便调用。
发现自己还是菜得很，一个简单效果被我写得这么复杂…… 我还真有点佩服自己。-.-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<title>图片链接轮换代码, 支持预载</title>
</head>
<script language="JavaScript">
<!--
function iScroll(pics, itv, target)
{
var me = this;
this.curIdx = 0;
this.target = target;
this.sources = pics;
var o = this.sources;
for (var i=0; i<o.length; i++)
{
var cur = o[i];
var img = new Image();
img.src = cur.i;
cur.i = img;
cur.w = img.width+'px';
cur.h = img.height+'px';
}
this.doScroll();
setInterval(function()
{
me.curIdx ++;
if(me.curIdx == o.length) me.curIdx = 0;
me.doScroll(me.curIdx);
}
, itv );
}
iScroll.prototype.doScroll = function()
{
var i = this.target;
var cur = this.sources[this.curIdx];
i.style.width = cur.w;
i.style.height = cur.h;
i.style.background = 'url('+cur.i.src+')';
i.href = cur.u;
i.onclick = function(){ open(this.href); return false; }
}
window.onload=function()
{
var itv = 3000;
var o = [
{'i':'http://www.google.cn/intl/zh-CN/images/logo_cn.gif', 'u':'http://www.googel.com'},
{'i':'https://www.aspxhome.com/images/logo.gif', 'u':'http://www.aspxhome.com'}
];
var target = document.getElementById('imgLink');
(new iScroll(o, itv, target));
}
//-->
</script>
<style>
#imgLink { display:block; }
</style>
<body>
<a href="#" id="imgLink"></a>
</body>
</html>
图片链接轮换查看效果：
0
投稿猜你喜欢
- [原文地址] VS 2008 Performance Improvements[原文发表时间] Thursday, September 27
- 本文实例讲述了php实现的支持断点续传的文件下载类及其用法，是非常实用的技巧。分享给大家供大家参考。具体方法如下：通常来说，php支持断点续
数组转换成切片a := [10]int{}fmt.Println(a) s1 := a[:10] //取前10个元素- 近期遇到一个需求，就是用PySide2做出一个GUI，并且要将后台使用Matplotlib绘制的图显示在界面上。自己琢磨了蛮久，网上也搜了不
- 很多人一直都有个想法，要是可以随心所欲的操作iframe就好了。这样静态页面也就有了相当于后台动态页面php,jsp,asp中include
- 常用的函数和方法在Python中，os库提供了大量与操作系统相关的函数和方法。以下是一些常用的函数和方法及其详细介绍、案例和完整注释：get
- python开发中经常遇到报错的情况，但是warning通常并不影响程序的运行，而且有时特别讨厌，下面我们来说下如何忽略warning错误。
- 测试的过程中经常需要截取屏幕，通常的做法是使用手机自带的截屏功能，然后将截屏文件复制出来，这种方法的优点是不需要连接数据线就可截屏，缺点则是
- 什么是GhostNet模型GhostNet是华为诺亚方舟实验室提出来的一个非常有趣的网络，我们一起来学习一下。2020年，华为新出了一个轻量
- 目录简介图形加载和说明图形的灰度灰度图像的压缩原始图像的压缩总结简介本文将会以图表的形式为大家讲解怎么在NumPy中进行多维数据的线性代数运
- 最近，想在我的YouMoney（http://code.google.com/p/youmoney/）里面增加提取用户操作系统版本信息。比如
- java通过mysql的加解密函数实现敏感字段存储1.AES加解密工具类：public class AESUtils {public sta
- 一、python开发环境安装与配置1.python的下载从https://www.python.org/downloads/进行下载。2.安
- SPAN 和 DIV 的区别在于，DIV(division)是一个块级元素，可以包含段落、标题、表格，乃至诸如章节、摘要和备注等。而SPAN
- 环境： python 2.7 + win10工具：fiddler postman 安卓模拟器首先，打开fiddler，fiddler作为ht
- 我就废话不多说了，直接上代码吧！import numpy as npimport torchimport torch.nn as nnimp
- Static files管理static files指一些用到的像css,javascript,images之类的文件。在开发阶段：1.在s
- 注意：本文基于Python2.4完成；如果看到不明白的词汇请记得百度谷歌或维基，whatever。 1. 正则表达式基础 1.1. 简单介绍
- 打开VB6，新建ActiveX DLL 2、在工程引用中加入Microsoft Active Server Pages Object Lib
- 1.字符串处理将字符串中的数字替换成其两倍的值，例如：修改前："AS7G123m (d)F77k"修改后："A
