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 相关文章推荐
JQuery 实现的页面滚动时浮动窗口控件
Jul 10 Javascript
jQuery chili图片远处放大插件
Nov 30 Javascript
jquery 跨域访问问题解决方法(笔记)
Jun 08 Javascript
文本框input聚焦失焦样式实现代码
Oct 12 Javascript
jquery 漂亮的删除确认和提交无刷新删除示例
Nov 13 Javascript
JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法
Dec 27 Javascript
用jQuery实现优酷首页轮播图
Jan 09 Javascript
vue+vuex+axio从后台获取数据存入vuex实现组件之间共享数据
Apr 22 Javascript
微信小程序实现之手势锁功能实例代码
Jul 19 Javascript
微信小程序-API接口安全详解
Jul 16 Javascript
JS可断点续传文件上传实现代码解析
Jul 30 Javascript
Vue Object.defineProperty及ProxyVue实现双向数据绑定
Sep 02 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
8个出色的WordPress SEO插件收集
2011/02/26 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
Laravel 5.4.36中session没有保存成功问题的解决
2018/02/19 PHP
PHP实现用户登录的案例代码
2018/05/10 PHP
关于PHP中interface的用处详解
2020/07/26 PHP
editable.js 基于jquery的表格的编辑插件
2011/10/24 Javascript
JavaScript高级程序设计 阅读笔记(七) ECMAScript中的语句
2012/02/27 Javascript
单击和双击事件的冲突处理示例代码
2014/04/03 Javascript
百度地图自定义控件分享
2015/03/04 Javascript
JS本地刷新返回上一页代码
2016/07/25 Javascript
JavaScript 闭包详细介绍
2016/09/28 Javascript
Bootstrap Navbar Component实现响应式导航
2016/10/08 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
浅析BootStrap中Modal(模态框)使用心得
2016/12/24 Javascript
vue中将网页打印成pdf实例代码
2017/06/15 Javascript
vue自定义全局组件(自定义插件)的用法
2018/01/30 Javascript
Angular动画实现的2种方式以及添加购物车动画实例代码
2018/08/09 Javascript
解决JavaScript中0.1+0.2不等于0.3问题
2018/10/23 Javascript
Vue+Vant 图片上传加显示的案例
2020/11/03 Javascript
[41:56]Spirit vs Liquid Supermajor小组赛A组 BO3 第一场 6.2
2018/06/03 DOTA
从零学python系列之从文件读取和保存数据
2014/05/23 Python
python通过socket实现多个连接并实现ssh功能详解
2017/11/08 Python
Python3.6简单的操作Mysql数据库的三个实例
2018/10/17 Python
使用Flask-Cache缓存实现给Flask提速的方法详解
2019/06/11 Python
python用for循环求和的方法总结
2019/07/08 Python
python列表推导式操作解析
2019/11/26 Python
PyTorch中Tensor的数据统计示例
2020/02/17 Python
英国手机零售商:Metrofone
2019/03/18 全球购物
90后毕业生的求职信范文
2013/09/21 职场文书
护士实习鉴定范文
2013/12/22 职场文书
八项规定整改措施
2014/02/12 职场文书
法律专业求职信
2014/05/24 职场文书
村当支部个人对照检查材料思想汇报
2014/10/06 职场文书
创建文明城市倡议书
2015/04/28 职场文书
导游词之贵州百里杜鹃
2019/10/29 职场文书
详解JAVA中的OPTIONAL
2021/06/14 Java/Android