A very excellent piece of effect code, you can scroll up and down, left and right, and you have collected it! !
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>Rolling test</title>
<script type="text/javascript">
/**
* @para obj Target object such as: "demo" in demo,deml1,demo2 can be arbitrary, as long as it is not repeated
*
* @para speed The larger the scroll speed, the slower it is
*
* @para direction Scrolling directions include: left, right, down, up
*
* @para objWidth Total visible area width
*
* @para objHeight Total visible area height
*
* @para filePath The path to store scrolling pictures (if it is automatically obtained to scroll the picture in the folder)
*
* @para contentById Scroll the content with a certain id contentById This scrolling and filePath cannot coexist. Please note
*
* @para Usage example scrollObject("res",50,"up",470,200,"","resource") Scroll the content under contentById(resource)
*
* @para Usage instance scrollObject("res",50,"up",470,200,"d:\\images\\","") Automatically obtain and scroll content under filePath(images), currently only supports ie
*/
var $ =function(id){return (id)}
// Scrollfunction scrollObject(obj,speed,direction,objWidth,objHeight,filePath,contentById)
{
// Execute initializationif(direction=="up"||direction=="down")
(UDStructure());
else
(LRStructure());
var demo = $(obj);
var demo1 = $(obj+"1");
var demo2 = $(obj+"2");
var speed=speed;
$(contentById).="none"
="hidden";
= objWidth+"px";
= objHeight+"px";
="0 auto";
if(filePath!="")
=file();
if(contentById!="")
=$(contentById).innerHTML;
=;
// Scroll left and rightfunction LRStructure()
{
var _html ="";
_html+="<div id='"+obj+"' >";
_html+="<table border='0' align='left' cellpadding='0' cellspacing='0' cellspace='0'>";
_html+="<tr>";
_html+="<td nowrap='nowrap' id='"+obj+"1' >";
// Here is the content to be scrolled _html+="</td>";
_html+="<td nowrap='nowrap' id='"+obj+"2' ></td>";
_html+="</tr>";
_html+="</table>";
_html+="</div>";
return _html;
}
// Scrolling structurefunction UDStructure()
{
var _html ="";
_html+="<div >";
_html+="<table border='0' align='left' cellpadding='0' cellspacing='0' cellspace='0'>";
_html+="<tr>";
_html+="<td id='"+obj+"1' >";
// Here is the content to be scrolled _html+="</td>";
_html+="</tr>";
_html+="<tr>";
_html+="<td id='"+obj+"2' ></td>";
_html+="</tr>";
_html+="</table>";
_html+="</div>";
return _html;
}
// Get the picture in the folderfunction file()
{
var tbsource = filePath;//Local folder path filePath = ();
if (filePath=="")
return"";
var imgList ="";
var objFSO =new ActiveXObject('');
// Whether the folder existsif(!(tbsource))
{
alert("<"+tbsource+">The folder path does not exist, or the path cannot contain a file name!");
objFSO =null;
return;
}
var objFolder = (tbsource);
var colFiles =new Enumerator();
var re_inf1 =/\.jpg$/; //Verify whether the folder file is jpg file
for (;!();()) //Read the file in the folder {
var objFile = ();
if(re_inf1.test(()))
{
imgList +="<img src="+filePath+"/"++">";
}
}
return imgList;
}
// Roll leftfunction left()
{
if(<=0)
{
-=;
}
else
{
++;
}
}
// Roll rightfunction right()
{
if(<=0)
{
+=;
}
else
{
--
}
}
// Roll downfunction down()
{
if(>=0)
{
+=;
}
else
{
--
}
}
// Roll upfunction up()
{
if(<=0)
{
-=;
}
else
{
++
}
}
// Switch directionfunction swichDirection()
{
switch(direction)
{
case"left":
return left();
break;
case"right":
return right();
break;
case"up":
return up();
break;
default:
return down();
}
}
// Repeat executionvar myMarquee=setInterval(swichDirection,speed);
// Mouse hover =function() {clearInterval(myMarquee);}
// Start scrolling again =function() { myMarquee=setInterval(swichDirection,speed);}
}
</script>
</head>
<body>
<div >
<table width="1000" border="0" align="center" cellpadding="5" cellspacing="0">
<tr>
<td width="200"><img src="/attachment/200910/22/4188617_12561994098532.jpg" alt="" width="200" height="150"/></td>
<td width="200"><img src="/2008-05-27/2008527145211519_2.jpg" alt="" width="200" height="150"/></td>
<td width="200"><img src="/20090823/383152_215728074589_2.jpg" alt="" width="200" height="150"/></td>
<td width="200"><img src="/20100628/4643449_170245009531_2.jpg" alt="" width="200" height="150"/></td>
<td width="200"><img src="/2008-05-30/20085309524648_2.jpg" alt="" width="200" height="150"/></td>
</tr>
</table>
</div>
<script type="text/javascript">
scrollObject("sr",50,"right",800,160,"","img")
</script>
</body>
</html>
The above is the entire content of this article. For more information about JavaScript, you can check it out:JavaScript Reference Tutorial》、《JavaScript Code Style Guide》, I hope everyone supports me more.