<script>
//<!--代码开始-->
var speed = 10;<!--速度控制,数值越大速度越慢-->
var intAWidth = 530;<!--滚动区域宽度-->
var intAHeight = 80;<!--滚动区域高度-->
var direction = "left";<!--滚动方向-->
var collectScroll;
var tab;
var tab1;
var tab2;
var MyMar;
/**
*自动滚动类
*/
function autoScroll(){
this.items = [];
this.addItem = function(adURL,strURL,strBak,intTarget){
var newItem = {};
newItem.adURL = adURL;
newItem.strURL = strURL;
newItem.strBak = strBak;
newItem.intTarget = intTarget;
this.items[this.items.length] = newItem;
}
this.play = function(){
collectScroll = this.items;
scrollHtml();
tab=document.getElementById("demo");
tab1=document.getElementById("demo1");
tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
MyMar=setInterval(Marquee,speed);
}
}
/**
*页面滚动类
*/
function scrollHtml(){
var imgHtml = "";
for(var i=0;i<collectScroll.length;i++){
var a = collectScroll[i];/*这个地方有些网站上贴的代码少了【i】 */
imgHtml += "<a href=\""+a.strURL+"\" target=\""+a.intTarget+"\"><img src=\""+a.adURL+"\" alt=\""+a.strBak+"\" border=\"0\" /></a>";
}
var b,c,d;
if(direction == "left" || direction == "right"){
b = "<div id=\"indemo\" style=\"float: left;width: 800%\">";
c = " style=\"float: left\"";
d = "</div>";
}else{
b = "";
c = "";
d = "";
}
document.writeln("<div id=\"demo\" onmouseover=\"clearInterval(MyMar)\" onmouseout=\"MyMar=setInterval(Marquee,speed)\" style=\"overflow:hidden; width:"+intAWidth+"px;height:"+intAHeight+"px\">");
document.writeln(b+"<div id=\"demo1\""+c+">");
document.writeln(imgHtml);
document.writeln("</div><div id=\"demo2\""+c+">"+d+"</div></div>");
}
/**
*滚动方向
*/
function Marquee(){
if(direction == "top"){
if(tab2.offsetTop-tab.scrollTop<=0){
tab.scrollTop-=tab1.offsetHeight;
}else{
tab.scrollTop++;
}
}else if(direction == "down"){
if(tab1.offsetTop-tab.scrollTop>=0)
tab.scrollTop+=tab2.offsetHeight;
else{
tab.scrollTop--;
}
}else if(direction == "left"){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth;
else{
tab.scrollLeft++;
}
}else if(direction == "right"){
if(tab.scrollLeft<=0)
tab.scrollLeft+=tab2.offsetWidth;
else{
tab.scrollLeft--;
}
}
}
var theAutoScroll= new autoScroll();
theAutoScroll.addItem("img/yjqx.jpg","qiangxian.asp","维修抢险","_blank");// img/yjqx.jpg
theAutoScroll.addItem("img/sqwd1.jpg","shouqiwangdian.asp","售气网点","_blank");
theAutoScroll.addItem("img/pegc1.jpg","pepipe.asp","PE管材","_blank");
theAutoScroll.addItem("img/rqj.jpg","ranqiju.asp","燃具经营","_blank");
<!--此处可以继续添加图片-->
theAutoScroll.play();
<!--代码结束-->
</script>
分享到:
相关推荐
js无缝滚动代码制作js图片无缝滚动向上无缝滚动 js无缝滚动代码制作js图片无缝滚动向上无缝滚动 js无缝滚动代码制作js图片无缝滚动向上无缝滚动
s无缝滚动制作多种无缝滚动效果js文字无缝滚动和js图片无缝滚动,直接复制副本标签js无缝滚动代码。内含js代码下载。
js产品图片无缝滚动代码向左和向上图片无缝滚动代码
js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js 图片无缝滚动js ...
jquery图片无缝滚动代码左右上下无缝滚动图片
图片无缝滚动插件上下左右图片无缝滚动代码
自己结合网上资源做的js无缝图片滚动,IE78,firefox,chrome测试
js代码 无缝滚动 js代码 无缝滚动 js代码 无缝滚动
鼠标感应使图片无缝滚动,且能鼠标控制左右滚动的JS代码
简单的图片无缝滚动效果代码免费下载
实现图片无缝滚动效果,可以改变图片的大小和滚动的速度
js图片左右无缝滚动用鼠标控制图片滚动 js图片左右无缝滚动用鼠标控制图片滚动 js图片左右无缝滚动用鼠标控制图片滚动
js图片无缝滚动代码
js无缝图片滚动,很不错,可以做到无缝图片流动效果,js无缝图片滚动.
js经典效果,图片切换,无缝滚动,js菜单
js图片滚动插件支持单排图片上下滚动、图片无缝滚动 js图片滚动插件支持单排图片上下滚动、图片无缝滚动 js图片滚动插件支持单排图片上下滚动、图片无缝滚动
JS实现图片无缝滚动的完美解决
使用js实现图片左右滚动,图片向左无缝滚动,运行简单,只需下载之后就能运行。
图片自己添加,功能是可以暂停图片滚动,移出鼠标后开始滚动,可点击向左或向右改变滚动方向,默认是向左