javascript+xml实现简单图片轮换(只支持IE)


Posted in Javascript onDecember 23, 2012

最近无聊,看着许多网站都有广告自动轮换,自己试着写了一个图片轮换,代码和功能都很简单,只支持IE的,FF的还要加些东东.

xml文件:test.xml

<?xml version="1.0" encoding="gb2312"?> 
<ad> 
<neteasy path="image/64_jpg.jpg">http://www.163.com</neteasy> 
<sina path="image/lining.jpg">http://www.sina.com.cn</sina> 
<sohu path="image/Image00045.jpg">http://www.sohu.com</sohu> 
</ad>

HTML
<img id="image1" name="image1" src="image/64_jpg.jpg" style="cursor:hand; width: 110px; height: 103px;"/>

javascript
<script> 
//图片轮换 
var a = 0 ; 
var xmlDoc; 
var image1 = document.getElementById("image1"); 
function loadxml(path) 
{ 
xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
xmlDoc.async = false; 
xmlDoc.load(path); 
} 
loadxml("test.xml"); 
function changeImage() 
{ 
var ad = xmlDoc.getElementsByTagName("ad")[0]; 
if(a == ad.childNodes.length) 
{ 
a=0; 
} 
var path = ad.childNodes[a].getAttribute("path"); 
var url = ad.childNodes[a].text; 
image1.src = path; 
image1.onclick = function(){window.open(url);}; 
a+=1; 
setTimeout("changeImage()",1000); 
} 
changeImage(); 
</script>
Javascript 相关文章推荐
JavaScript入门教程(6) Window窗口对象
Jan 31 Javascript
jQuery 行背景颜色的交替显示(隔行变色)实现代码
Dec 13 Javascript
javascript 计算两个整数的百分比值
Dec 26 Javascript
javascript 放大镜 v1.0 基于Yui2 实现的放大镜效果
Mar 08 Javascript
js中top/parent/frame概述及案例应用
Feb 06 Javascript
Jquery实现显示和隐藏的4种简单方式
Aug 28 Javascript
完善的jquery处理机制
Feb 21 Javascript
微信小程序之绑定点击事件实例详解
Jul 07 Javascript
元素全屏的设置与监听实例
Nov 28 Javascript
Vue实现table上下移动功能示例
Feb 21 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
May 30 Javascript
js实现电灯开关效果
Jan 19 Javascript
JavaScript与DOM组合动态创建表格实例
Dec 23 #Javascript
JavaScript执行效率与性能提升方案
Dec 21 #Javascript
JS实现图片预加载无需等待
Dec 21 #Javascript
Javascript根据指定下标或对象删除数组元素
Dec 21 #Javascript
JavaScript实现统计文本框Textarea字数增强用户体验
Dec 21 #Javascript
js返回上一页并刷新代码整理
Dec 21 #Javascript
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
Dec 21 #Javascript
You might like
简单PHP会话(session)说明介绍
2016/08/21 PHP
yii2.0框架场景的简单使用示例
2020/01/25 PHP
jquery nth-child()选择器的简单应用
2010/07/10 Javascript
javascript中怎么做对象的类型判断
2013/11/11 Javascript
js中reverse函数的用法详解
2013/12/26 Javascript
jquery操作cookie插件分享
2014/01/14 Javascript
js实现编辑div节点名称的方法
2014/12/17 Javascript
jQuery搜索同辈元素方法
2015/02/10 Javascript
深入理解JavaScript系列(48):对象创建模式(下篇)
2015/03/04 Javascript
jQuery中通过ajax的get()函数读取页面的方法
2016/02/29 Javascript
浅谈手写node可读流之流动模式
2018/06/01 Javascript
json字符串传到前台input的方法
2018/08/06 Javascript
使用canvas实现一个vue弹幕组件功能
2018/11/30 Javascript
Node.js实现简单的爬取的示例代码
2019/06/25 Javascript
使用 js 简单的实现 bind、call 、aplly代码实例
2019/09/07 Javascript
jQuery高级编程之js对象、json与ajax用法实例分析
2019/11/01 jQuery
JS正则表达式验证密码强度
2020/03/18 Javascript
Vue实现鼠标经过文字显示悬浮框效果的示例代码
2020/10/14 Javascript
你不知道的SpringBoot与Vue部署解决方案
2020/11/09 Javascript
python 获取文件列表(或是目录例表)
2009/03/25 Python
查看Django和flask版本的方法
2018/05/14 Python
Python对接六大主流数据库(只需三步)
2019/07/31 Python
从Pytorch模型pth文件中读取参数成numpy矩阵的操作
2021/03/04 Python
css3 iphone玻璃透明气泡完美实现
2013/03/20 HTML / CSS
美国新蛋IT数码商城:Newegg.com
2016/07/21 全球购物
香港太阳眼镜网上商店:SmartBuyGlasses香港
2016/07/22 全球购物
为奢侈时尚带来了慈善元素:Olivela
2018/09/29 全球购物
实习自我鉴定范文
2013/10/30 职场文书
机械电子工程专业推荐信范文
2013/11/20 职场文书
中专自我鉴定
2014/02/05 职场文书
员工试用期考核自我鉴定
2014/04/13 职场文书
会议邀请函
2015/01/30 职场文书
党性修养心得体会2016
2016/01/21 职场文书
表扬稿表扬信的格式及范文
2019/06/24 职场文书
golang fmt格式“占位符”的实例用法详解
2021/07/04 Golang
Java 中的 Lambda List 转 Map 的多种方法详解
2022/07/07 Java/Android