A common, seamless picture scroll from right to left

2011-05-16  来源:本站原创  分类:Web  人气:77 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
                <title> Picture scroll </title>
        </head>
        <body>
                <style type="text/css">
<!--
#demo {
        background: #FFF;
        overflow: hidden;
        border: 1px dashed #CCC;
        width: 500px;
}

#demo img {
        border: 3px solid #F2F2F2;
}

#indemo {
        float: left;
        width: 800%;
}

#demo1 {
        float: left;
}

#demo2 {
        float: left;
}
-->
</style>
                <div>
                        <div>
                                <div>
                                        <a href="#"><img src="/jscss/demoimg/wall_s1.jpg" border="0" />
                                        </a>
                                        <a href="#"><img src="/jscss/demoimg/wall_s2.jpg" border="0" />
                                        </a>
                                        <a href="#"><img src="/jscss/demoimg/wall_s3.jpg" border="0" />
                                        </a>
                                        <a href="#"><img src="/jscss/demoimg/wall_s4.jpg" border="0" />
                                        </a>
                                        <a href="#"><img src="/jscss/demoimg/wall_s5.jpg" border="0" />
                                        </a>
                                        <a href="#"><img src="/jscss/demoimg/wall_s6.jpg" border="0" />
                                        </a>
                                </div>
                                <div></div>
                        </div>
                </div>
                <script>
<!--
        var speed=10;
        var tab=document.getElementById("demo");
        var tab1=document.getElementById("demo1");
        var tab2=document.getElementById("demo2");
                tab2.innerHTML=tab1.innerHTML;
        function Marquee(){
                if(tab2.offsetWidth-tab.scrollLeft<=0)
                        tab.scrollLeft-=tab1.offsetWidth
                else{
                        tab.scrollLeft++;
                }
        }
        var MyMar=setInterval(Marquee,speed);
        tab.onmouseover=function() {clearInterval(MyMar)};
        tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
</script>
        </body>
</html>

Note that we must put the following javascript can use!

相关文章
  • A common, seamless picture scroll from right to left 2011-05-16

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

  • Picture scroll code, images seamlessly rolling code, images automatically scroll and control the rolling direction 2010-09-13

    Picture scroll code, images seamlessly rolling code, images automatically scroll and scroll direction can be controlled, to see the effect will consequently understand. picture scroll code, picture seamless rolling code <meta http-equiv="Content-T

  • Picture scroll code - 1 2010-06-05

    Picture scroll code (scroll right to left) <marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http:// To scroll through pictures address 1"> <img border="0" s

  • blackberry started - picture scroll 2010-09-06

    1, picture scroll package com.bb.test; import net.rim.device.api.system.Bitmap; import net.rim.device.api.ui.Color; import net.rim.device.api.ui.container.MainScreen; import net.rim.device.api.ui.decor.BackgroundFactory; import net.rim.device.api.ui.

  • JQuery plug-in Easy Slider (picture scroll, multi-style settings) 2010-05-15

    Parameter part of the explanation auto: true, / / when not to conduct any operation, whether the automatic scrolling, when carried out after the operation (such as: Click the next one) will not roll their own continuous: true, / / whether to automati

  • js to achieve picture scroll 2010-05-14

    As follows: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&q

  • Picture Scroll effect 2010-12-15

    <! - Head area code -> <head> <SCRIPT Language=JavaScript type=text/JavaScript> <! - / / More javascript from http://www.webjx.com var sh; marqueesWidth = 610; preLeft = 0; currentLeft = 0; stopscroll = false; getlimit = 0; preTop = 0

  • [Transfer] DIV + CSS + JS code download images seamlessly scroll 2011-01-10

    Seamless scrolling DIV pictures, DIV seamless picture scroll, DIV seamless rolling under the picture, DIV picture scroll left seamless, DIV seamless picture scroll from right First look at a few of the properties of the object: innerHTML: set or get

  • JQuery control seamless scrolling picture 2010-06-09

    2009-05-10 Often asked how the picture in the HTML on the production of seamless rolling, I own a number of projects also often used, spent some time today, Internet search a little, down some source looked back, discoveries have been made only IE ca

  • js mouse wheel zoom picture screen scroll bar 2010-12-10

    Mouse wheel to zoom in to make a picture, scroll wheel with the browser's scroll bar to scroll through, after some agonizing, finally resolved, and posted to those who need it refer to the following: <! DOCTYPE html PUBLIC "- / / W3C / / DTD XHTML

  • html text scroll code 2010-09-30

    Code is as follows <MARQUEE> scrolling text </ MARQUEE> <marquee scrollamount="2" direction="up"> <div align="left"> <br /> </ Div> <center> <font face=" Blackbody " colo

  • Absolute positioning of div layers, so do not cover the flash 2009-07-01

    Today, a picture scroll of the case, that is to click on to enlarge the view, with my blog Even just plug that picture -ins - highslide to the whole, the effect of JS things good! Transplant go very smoothly, but there is a flash ad to enlarge old ph

  • js Advertising slide images (class hp official website, inadvertently found) (change) 2010-03-29

    <style type="text/css"> .picshow { z-index:444; position:relative; background-color:#e4f2fa; width: 100%; height: 250px} .picshow_main { position: relative; width: 800px; height: 600px} .picshow_main .imgbig { filter: progid:dximagetransfo

  • ofbiz step by step learning hello word (hello2) 2010-04-22

    Expansion hello1 application creen-widget, decorator, and actions, practice hello2 application. 1. Webapp copy hello1 to hello2 renamed under the hello1 as "hello2" and modify the ofbiz-component.xml file. Read as follows: <?xml version="

  • html text, images, full screen scrolling code 2010-06-07

    The following picture scroll code only for html pages, respectively, upward and downward to the left to the right of the scroll! The following code into html page <body> </ body> in on it! We'll see how! Can be the height width of the scroll b

  • jQuery large scrolling text + images show changes in the animation layout 2010-08-02

    View results Download jQuery large text + picture scroll changing the layout animation sample code to set a timer, switching intervals, scroll time, fade time, fade time, start sequence, the number of rolling elements, the width of the contents of ea

  • Html <MARQUEE> scrolling text 2010-10-08

    Code is as follows <MARQUEE> scrolling text </ MARQUEE> <marquee scrollamount="2" direction="up"> <div align="left"> <br /> </ Div> <center> <font face=" Bold " color=&qu

  • graphics library python Python Imaging Library (PIL) Introduction and Installation (Reprinted Collection) 2010-10-14

    [Introduction] Two days to write a program with python, the need for a variety of formats handled some simple pictures, using the Python Imaging Library (PIL) library, the library can be used for some common operating picture, such as changing the im

  • HTML rollover effects 2010-11-09

    <Marquee to add the content (available <br Separated >) </ marquee> Html code editor required conversion, then the code into the source of conversion and articles Code is as follows <MARQUEE> scrolling text </ MARQUEE> <marqu

  • YUI rolling under the effect of transformation 2011-05-30

    The latest project uses YUI, just have a picture scroll function, look for a while before the code from the Internet, does fit with the can used, but will not stop the creation of image links, or div, send the image request, the service pressure, so