The special effect of flipping the picture horizontally and then flipping it vertically

Author：Eve Cole Update Time：2009-06-20 15:19:53

What we are going to introduce now is a new type of scrolling, using JS method to scroll subtitles: upward, pausing for one to two seconds in the middle:

<html> <head> <title></title> <meta http-equiv= "Content-Type" content="text/html; charset=gb2312" /> <meta name="description" content="Web page floating ad special effect code display with closing function" /> <meta name="keywords" content= "Webpage, webpage teaching, webpage development, book tutorials, video tutorials, webpage learning, webpage special effects, webpage production learning, webpage learning, website building academy, website building guide, animation production, animation tutorial, network programming, tutorial download, material, web page material , Logo source files, Banner materials, cool sites, cool site appreciation, ASP technology, PHP technology, ASP.NET technology, JSP technology, CGI technology, database technology, XML technology, CSS technology, JS, HTML, website building skills, introduction to production, production Skills, web page production skills, web page learning skills" /> <link href="http://www.downcodes.com/templates/downcodes/css/style.css" rel="stylesheet" type="text/css" / > </head> <body bgColor="#ffffff" leftMargin="0" topMargin="3"> <script> var marqueeContent=new Array(); //Define an array to store the displayed content marqueeContent[0] ='<A href="#" onclick="reinitMarquee()">Refresh the latest list</FONT></A>'; marqueeContent[1]='<a href=# target=_blank>Sixty latest updates to the site strip</a>'; marqueeContent[2]='<A href=# target=_blank>Feather Effect Making Tutorial</a>'; marqueeContent[3]='<A href=# target=_blank>MySQL&ASP</a>'; a>'; marqueeContent[4]='<A href=# target=_blank>Preliminary understanding of CSS3</a>'; marqueeContent[5]='<A href=# target=_blank>Fireworks MX 2004 performs panel operations </a>'; marqueeContent[6]='<A href=# target=_blank>Fireworks MX 2004 Contour Gradient Fill</a>'; marqueeContent[7]='<A href=# target=_blank>Bottle Flowers in</a>'; marqueeContent[8]='<A href=# target=_blank>Fireworks MX implements tabbed effect</a>'; marqueeContent[9]='<A href=# target= _blank>Couples: The atmosphere of love in black and white</a>'; marqueeContent[10]='<A href=# target=_blank>Make a MAC style Apple logo</a>'; marqueeContent[11]='<A href =# target=_blank>Eggshell production and character synthesis</a>'; var marqueeInterval=new Array(); //Define some common and frequently used variables var marqueeId=0; var marqueeDelay =4000; var marqueeHeight=16; //The next step is to define some 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()*(li)); 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" onmouseover="clearInterval (marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval('startMarquee()',marqueeDelay)"><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> </body> </html>