JavaScript I think we've all seen a variety of scrolling (the most commonly used in the news update above), generally as long as not a picture, are using HTML itself to provide a very good scrolling mark--marquee to complete (with JS can also achieve this effect) Of course it's not that pictures can't do that.
The following are some of the basic parameters of marquee:
The tag syntax is formatted as follows:
<marquee
Aligh=left|center|right|top|bottom
Bgcolor= #n
Direction=left|right|up|down
Behavior=type
Height=n
Hspace=n
Scrollamount=n
Scrolldelay=n
Width=n
Vspace=n
Loop=n> content </marquee>
Here's what the parameters mean:
Align: is to set the position of the active caption, in addition to the left, center, the right three positions, but also to increase the upper (top) and bottom (bottom) two positions.
bgcolor: Used to set the background color of the active caption, you can use the English word can also be a hexadecimal number.
Direction: The scrolling direction used to set the active marquee is left, right, up (up), down (down).
Behavior: The way to set up scrolling is mainly made up of three different ways:
Behavior= "Scroll" means to scroll from one end to the other end;
behavior= "Slide": means to slide quickly from one end to the other and not repeat;
Behavior= "alternate" means scrolling back and forth between the ends.
Height: Used to set the height of the scrolling marquee.
Width: Sets the length of the scrolling marquee.
Hspace and Vspace: Sets the width of the left and right borders and the top and bottom borders of the scrolling marquee, respectively.
ScrollAmount: Used to set the scrolling distance of the active caption. The smaller the number, the faster the scrolling.
Scrolldelay: Used to set the delay between scrolling two times, the smaller the number, the smaller the interval.
Loop: Sets the number of times to scroll, when loop=-1 indicates that it has been scrolling until the page is updated. The default is to scroll to the left indefinitely, the caption height is the text height, the scrolling range: the width of the horizontal scroll is the width of the current position, and the height of the vertical scroll is the height of the current position.
Now to introduce a new type of scrolling, using JS method to do caption scrolling: Up, in the middle pause a or two seconds (like the classic this):
Paste the following code to the location you want to show:
<script>
var marqueecontent=new Array (); Defines an array that holds the contents of the display
marqueecontent[0]= ' <a href= "#" > Refresh the latest list </FONT></A> ';
marqueecontent[1]= ' <a href=http://www.blueidea.com/updatelist.asp target=_blank> site Latest update 60 </a> ';
marqueecontent[2]= ' <a href=http://www.blueidea.com/tech/graph/2003/875.asp target=_blank> Feather effect Production Tutorial </a > ';
marqueecontent[3]= ' <a href=http://www.blueidea.com/tech/program/2003/831.asp target=_blank>mysql&asp</a > ';
marqueecontent[4]= ' <a href=http://www.blueidea.com/tech/web/2003/874.asp target=_blank> Preliminary Understanding css3</a> ' ;
marqueecontent[5]= ' <a href=http://www.blueidea.com/tech/graph/2003/864.asp target=_blank>Fireworks MX 2004 implementation of the surface version of the Operation </a> ';
marqueecontent[6]= ' <a href=http://www.blueidea.com/tech/graph/2003/872.asp target=_blank>Fireworks MX 2004 High gradient filling </a> ';
marqueecontent[7]= ' <a href=http://www.blueidea.com/photo/gallery/2003/873.asp target=_blank> The flowers in the bottle </a > ';
marqueecontent[8]= ' <a href=http://www.blueidea.com/tech/graph/2003/871.asp target=_blank>Fireworks MX Implement tabbed effects </a> ';
marqueecontent[9]= ' <a href=http://www.blueidea.com/photo/gallery/2003/870.asp target=_blank> couple: Black and white love air < /a> ';
marqueecontent[10]= ' <a href=http://www.blueidea.com/tech/graph/2003/866.asp target=_blank> make MAC-style Apple logo < /a> ';
marqueecontent[11]= ' <a href=http://www.blueidea.com/tech/graph/2003/868.asp target=_blank> eggshell making and shell-breaking character synthesis </a> ';
var marqueeinterval=new Array (); Define some variables that are common and often used
var marqueeid=0;
var marqueedelay=4000;
var marqueeheight=16;
The next step is to define some of the functions to be used
Array.prototype.random=function () {
var a=this;
var l=a.length;
for (Var i=0;i<l;i++) {
var R=math.floor (Math.random () * (l-i));
A=a.slice (0,r). Concat (A.slice (r+1)). Concat (A[r));
}
return A;
}
function Initmarquee () {
Marqueecontent=marqueecontent.random ();
var str= ';
For (Var i=0;i<math.min (3,marqueecontent.length); i++) str+= (i>0? ') ': ') +marqueecontent[i];
document.write (' <div id=marqueebox style= overflow:hidden;height: ' +marqueeheight+ ' px ' ><div> ' +str+ ' </div></div> ');
marqueeid+=2;
if (marqueecontent.length>3) Marqueeinterval[0]=setinterval ("StartMarquee ()", marqueedelay);
}
function Reinitmarquee () {
js_scroll_content.src= ' Scroll_content2.js ';
Marqueecontent=marqueecontent.random ();
var str= ';
For (Var i=0;i<math.min (3,marqueecontent.length); i++) str+= (i>0? ') ': ') +marqueecontent[i];
marqueebox.childnodes[(marqueebox.childnodes.length==1?0:1)].innerhtml=str;
marqueeid=2;
}
function StartMarquee () {
var str= ';
for (var i=0; (i<3) && (marqueeid+i<marqueecontent.length); i++) {
str+= (i>0? ') ': ') +marqueecontent[marqueeid+i];
}
marqueeid+=3;
if (marqueeid>marqueecontent.length) marqueeid=0;
if (marqueebox.childnodes.length==1) {
var nextline=document.createelement (' DIV ');
NEXTLINE.INNERHTML=STR;
Marqueebox.appendchild (nextline);
}
else {
MARQUEEBOX.CHILDNODES[0].INNERHTML=STR;
Marqueebox.appendchild (Marqueebox.childnodes[0]);
Marqueebox.scrolltop=0;
}
Clearinterval (marqueeinterval[1]);
Marqueeinterval[1]=setinterval ("Scrollmarquee ()", 20);
}
function Scrollmarquee () {
marqueebox.scrolltop++;
if (marqueebox.scrolltop%marqueeheight== (marqueeHeight-1)) {
Clearinterval (marqueeinterval[1]);
}
}
Initmarquee ();
</script>
The above has made a general introduction to this kind of rolling practice of the website.
