Uninterrupted rolling list of news articles. compatible with IE, Firefox, and opera, it complies with W3C standards. Available as marquee

Source: Internet
Author: User

<! -- 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 news Article List </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 </H2>
</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 =" ASP Program Simulate the first-Child function "> use ASP to simulate the first-Child function </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">
// Picture scrolling without interruption Code 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> <textarea id="runcode78043"><! -- Quirks mode --></textarea> Xmlns = "http://www.w3.org/1999/xhtml">


CSS layout by Forestgan2006-11-1 presentation

    • Three-column adaptive width liquid layout │ three column liquid layouts
    • Compatibility with CSS in Internet Explorer 7 -- box model changes
    • Horizontally and vertically centered images of unknown size in a known size container (2)
    • Two Methods for loading different CSS for different browsers: CSS browser Selector
    • Use ASP to simulate the first-Child Function
    • Several methods to check whether the webpage meets the standards
    • Accessibility and general Developer Tools
    • Solution for horizontal center of list menus with Unknown Total Width
    • Robots.txt file used by robots
    • Vertical and horizontal center of an unknown size image in a known container

Design by forestganDocument list uninterrupted scrolling demonstration page design and production: forestgan adopts shared creation authorization-signature and non-commercial use
Back to previous page

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.