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 1.2.x 升? 1.3.x 注意事项
May 06 Javascript
js 获取Listbox选择的值的代码
Apr 15 Javascript
jquery插件开发之实现google+圈子选择功能
Mar 10 Javascript
原生JS实现-星级评分系统的简单实例
Aug 21 Javascript
javascript轮播图算法
Oct 21 Javascript
适用于手机端的jQuery图片滑块动画
Dec 09 Javascript
Vue组件开发技巧总结
Mar 04 Javascript
vue 指定组件缓存实例详解
Apr 01 Javascript
vue中v-model的应用及使用详解
Jun 27 Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
Aug 03 jQuery
javascript头像上传代码实例
Sep 28 Javascript
javascript实现计算器功能
Mar 30 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+Tidy-完美的XHTML纠错+过滤
2007/04/10 PHP
php中ob(Output Buffer 输出缓冲)函数使用方法
2007/07/21 PHP
生成卡号php代码
2008/04/09 PHP
PHP 可阅读随机字符串代码
2010/05/26 PHP
php实现随机显示图片方法汇总
2015/05/21 PHP
PHP实现表单提交数据的验证处理功能【防SQL注入和XSS攻击等】
2017/07/21 PHP
PHP页面静态化――纯静态与伪静态用法详解
2020/06/05 PHP
Jquery Ajax学习实例 向页面发出请求,返回XML格式数据
2010/03/14 Javascript
js location.replace与location.reload的区别
2010/09/08 Javascript
什么是json和jsonp,jQuery json实例详详细说明
2012/12/11 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
JavaScript通过元素的ID和name设置样式
2014/07/08 Javascript
angularJS提交表单(form)
2015/02/09 Javascript
HTML5实现留言和回复页面样式
2015/07/22 Javascript
Javascript模仿淘宝信用评价实例(附源码)
2015/11/26 Javascript
JavaScript下的时间格式处理函数Date.prototype.format
2016/01/27 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
vue router demo详解
2017/10/13 Javascript
微信小程序结合Storage实现搜索历史效果
2019/05/18 Javascript
layui-table获得当前行的上/下一行数据的例子
2019/09/24 Javascript
详解elementUI中input框无法输入的问题
2020/04/27 Javascript
vue 清空input标签 中file的值操作
2020/07/21 Javascript
vue 内联样式style中的background用法说明
2020/08/05 Javascript
python对json的相关操作实例详解
2017/01/04 Python
pandas读取csv文件,分隔符参数sep的实例
2018/12/12 Python
python 机器学习之支持向量机非线性回归SVR模型
2019/06/26 Python
Python 实现输入任意多个数,并计算其平均值的例子
2019/07/16 Python
python将字母转化为数字实例方法
2019/10/04 Python
Python操作Excel把数据分给sheet
2020/05/20 Python
用python写PDF转换器的实现
2020/10/29 Python
墨西哥网上超市:Superama
2018/07/10 全球购物
酒店个人培训自我鉴定
2013/12/11 职场文书
拾金不昧的表扬信
2014/01/16 职场文书
计算机专业毕业生自荐信范文
2014/03/06 职场文书
开展党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
Python 用户输入和while循环的操作
2021/05/23 Python