Results 1 to 2 of 2

Thread: JavaScript Placement ...

  1. #1
    Join Date
    Mar 2008
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default JavaScript Placement ...

    http://www.freewebs.com/awordfitlysp...aa1testaaa.htm

    Need the 'scrolling text box' along side the image - it is now visible underneath the image ...

    does anyone know the fix for this?

    thank you for your replies & help!

    CL

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    
    <head>
      <title></title>
    <style type="text/css">
    
    .c1 {
      position:relative;width:400px;height:250px;border:solid black 1px;
    }
    
    #slide {
      position:absolute;overflow:hidden;left:190px;top:5px;width:200px;height:220px;border:solid black 1px;
    }
    
    </style>
    <script type="text/javascript">
    var S;
    
    function Slide(id,ms){
     var obj=document.getElementById(id);
     this.slide=document.createElement('DIV');
     var clds=obj.childNodes
     for (var clds=obj.childNodes,ary=[],z0=0;z0<clds.length;z0++) ary[z0]=clds[z0];
     for (var z1=0;z1<ary.length;z1++) this.slide.appendChild(ary[z1]);
     this.slide.style.position='absolute';
     this.slide.style.left='0px';
     this.slide.style.top='0px';
     this.slide.style.width=obj.offsetWidth+'px';
     obj.appendChild(this.slide);
     this.max=obj.offsetHeight-this.slide.offsetHeight;
     this.to=null;
     this.ms=ms||100;
    }
    
    Slide.prototype.scroll=function(ud){
     var pos=parseInt(this.slide.style.top)+ud,oop=this;
     if(pos>this.max&&pos<0){
     this.slide.style.top=pos+'px';
     this.to=setTimeout(function(){ oop.scroll(ud); },this.ms);
     }
    }
    
    Slide.prototype.stop=function(){
     clearTimeout(this.to);
    }
    
    
    </script>
    </head>
    
    <body onload="S=new Slide('slide',10);">
    <div class="c1" >
    <img src="http://www.freewebs.com/awordfitlyspoken/AWFSM-AM2009.jpg" />
    <img src="http://www.freewebs.com/awordfitlyspoken/down.gif" onmousedown="S.scroll(1);" onmouseup="S.stop();" onmouseout="S.stop();"/>
    <img src="http://www.freewebs.com/awordfitlyspoken/up.gif"  onmousedown="S.scroll(-1);" onmouseup="S.stop();" onmouseout="S.stop();"/>
    <div id="slide" >
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/snake1.htm"><font color="black">1. Snake Dancing</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/collaspe1.htm"><font color="black">2. Evangelical Collapse</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/social1.htm"><font color="black">3. Not Among Friends</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/billallin1.htm"><font color="black">4. All Religions are Fiction?</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/nightmare1.htm"><font color="black">5. Big Brother Digest</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/teens1.htm"><font color="black">6. Economy Inspires</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/mother1.htm"><font color="black">7. Big Mother</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/guide1.htm"><font color="black">8. The Guide</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/pastor1.htm"><font color="black">9. Imminent Catastrophe</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/choking1.htm"><font color="black">10. Choking the Internet</a></p>
     <p><font size="3" face="Arial"><a href="http://www.freewebs.com/awordfitlyspoken/waiting1.htm"><font color="black">11. Why is Jesus Waiting?</a></p>
    <br />
    </div>
    </div>
    
    
    </body>
    
    </html>

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •