Home > Developer > JavaScript
<! -- Quirks Mode -->
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> rolling ty Studio │ uninterrupted list of news articles </title>
<Link rel = "stylesheet" type = "text/css" href = "/tutorials/demo/css/main.css"/>
<! -- [If IE]> <style>
@ Import url ("/tutorials/demo/css/ie.css ");
</Style> <! [Endif] -->
<Style type = "text/css">
<! --
A {background: # FFF; color: #333 ;}
A: hover {background: # FFF; color: # C00 ;}
# Demo ul {text-align: left ;}
# Demo li a {line-height: 2em; padding-left: 1.5em; background: # F7F7F7 url (/img/arrow_l2_over.gif) no-repeat 0 50%; display: block; margin-bottom: 1px ;}
# FGWrapper {width: 400px; margin: 2em auto; background: # EEE ;}
# Demo {overflow: hidden; width: 390px; height: 150px; background: # FFF; margin: 5px; float: left; display: inline ;}
# Desc {font-size: 1em; padding: 0 10px 10px; clear: both; text-align: left ;}
# Copyright {float: right ;}
-->
</Style>
<Noscript>
<Style type = "text/css">
# Demo {overflow: auto ;}
}
</Style>
</Noscript>
</Head>
<Body>
<Div id = "ForestganWrap">
<Div id = "forestganHeader"> <a href = "/"> </a>
<H1> CSS Layout demonstration CSS Layout by Forestgan <H2 id = "demo_date"> 2006-11-1 </Div>
<Div id = "forestganMiddle"> <div id = "FGWrapper">
<Div id = "demo">
<Div id = "demo1">
<Ul>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 1 & id = 76 "title =" Three columns adaptive width Liquid layout │ Three Column Liquid Layouts "> Three columns adaptive width Liquid layout │ Three Column Liquid Layouts </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 4 & id = 75 "title =" Internet Explorer 7 compatible with CSS -- Box Model Changes "> CSS compatibility of Internet Explorer 7 -- Box Model Changes </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 1 & id = 74 "title =" an image of unknown size is horizontally and vertically centered in a known size container (2) "> horizontally and vertically centered images of unknown sizes in a known-size container (2) </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 4 & id = 73 "title =" Two Methods of loading different CSS for different browsers: CSS Browser Selector "> two methods of loading different CSS for different browsers: CSS Browser selector </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 4 & id = 72 "title =" simulate the first-child function with ASP program "> simulate the first-child function with ASP program </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 1 & id = 71 "title =" several methods for checking whether the webpage meets the standards "> several methods for checking whether the webpage meets the standards </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 6 & id = 70 "title =" Accessibility and General Developer Tools "> Accessibility and General Developer tools </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 1 & id = 69 "title =" solution for horizontal center of list menu of unknown total width "> solution for horizontal center of list menu of unknown total width </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 4 & id = 68 "title =" robots.txt file for robots "> robots.txt file for robots </a> </li>
<Li> <a href = "http://www.forest53.com/tutorials/tutorials_show.asp? Sortid = 1 & id = 67 "title =" vertical and horizontal center of an unknown size image in a known container "> vertical and horizontal center of an unknown size image in a known container </> </li>
</Ul>
</Div>
<Div id = "demo2"> </div>
<Script type = "text/javascript">
// The image scrolling code without interruption, compatible with IE, Firefox, and Opera
// The original script is IE only, which is from the Internet and unknown to the author.
// Some content is standardized by forestgan for JS Code, and is compatible with browsers with gecko as the kernel and rewritten at-10-30.
// Http://www.forest53.com
Var speed = 40;
Var FGDemo = document. getElementById ('Demo ');
Var FGDemo1 = document. getElementById ('demo1 ');
Var FGDemo2 = document. getElementById ('demo2 ');
FGDemo2.innerHTML = FGDemo1.innerHTML
Function Marquee1 (){
If (FGDemo2.offsetHeight-FGDemo. scrollTop <= 0)
FGDemo. scrollTop-= FGDemo1.offsetHeight
Else {
FGDemo. scrollTop ++
}
}
Var MyMar1 = setInterval (Marquee1, speed)
FGDemo. onmouseover = function () {clearInterval (MyMar1 )}
FGDemo. onmouseout = function () {MyMar1 = setInterval (Marquee1, speed )}
</Script> </div>
<Div id = "desc"> <a href = "http://www.forest53.com"> <span id = "copyright"> Design by Forestgan </span> </a> Article list scrolling without interruption demo </div>
</Div>
</Div>
<Div id = "forestganFooter">
<Address>
Demo page design and production: <a href = "http://www.forest53.com"> Forestgan </a> using <a href = "http://www.creativecommons.cn/"> shared creation authorization </a> -- signature and non-commercial use <br/> <a href = "javascript: history. back () "> return to the previous page </a>
</Address>
</Div>
<Noscript>
<P> google-analytics </p>
</Noscript>
<Script src = "/js/copyrightdemo. js" type = "text/javascript"> </script>
<Noscript> <p> my stat </p> </noscript>
</Body>
</Html>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = UTF-8 "/> <title> rolling ty Studio │ list of uninterrupted rolling news articles </title> <link rel =" stylesheet "type =" text/css "href =" /tutorials/demo/css/main.css "/> <style type =" text/css "> </style> <noscript> <style type =" text/css "> # demo {overflow: auto ;}} </style> </noscript> </pead> <body> CSS Layout demonstration CSS Layout by Forestgan 2006-11-1 <ul> <li> Three-Column adaptive width Liquid Layout │ Three Column Liquid layouts </li> <li> CSS compatibility of Internet Explorer 7 -- Box Model Changes </li> <li> horizontally and vertically centered images of unknown sizes in a known-size container (2) </li> <li> two methods of loading different CSS for different browsers: CSS Browser Selector </li> <li> use ASP program to simulate the first-child function </ li> <li> several methods to locally check whether the webpage meets the standards </li> <li> Accessibility and General Developer tools </li> <li> List menu levels of unknown total width center solution </li> <li> is the robots.txt file of the robot program. </li> <li> vertical and horizontal center problems of unknown size images in a known container </li> </ul> design by Forestgan article list uninterrupted scrolling demonstration page Design and production: forestgan adopts shared authorization for creation-the signature and non-commercial use are returned to the previous page </address> </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
