Results 1 to 2 of 2

Thread: HomeMade Scrobblar

  1. #1
    Join Date
    Sep 2005
    Location
    In an overgrown fishing village
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default HomeMade Scrobblar

    Ok.. I'm trying to convert a script I found here for a scrolling textbox to include a full scrollbar that will function accross different browsers. It's working so far but it's missing one thing. All scrollbars have that middle bar that you can click and drag just likethe one on the side of the browser.
    I plan to optimise the coding of this later once I know how to do everything. So far I got this:

    HTML Code:
    <script  type="text/javascript">
    
    var crossobj
    var Holder
    var contentheight
    iens6=document.all||document.getElementById;
    ns4=document.layers;
    
    //specify speed of scroll (greater=faster)
    var speed=5
    
    function movedown(){
    if (iens6){
    var crossobj=document.getElementById? document.getElementById("content") : document.all.content
    var holder=document.getElementById? document.getElementById("container") : document.all.content
    var contentheight=crossobj.offsetHeight
    }
    else if (ns4){
    var crossobj=document.nscontainer.document.nscontent
    var holder=document.nscontainer
    var contentheight=crossobj.clip.height
    document.nscontainer.document.nscontent.visibility="show"
    }
    if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+holder.offsetHeight))
    crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
    else if (ns4&&crossobj.top>=(contentheight*(-1)+holder.crossobj.clip.height))
    crossobj.top-=speed
    movedownvar=setTimeout("movedown()",20)
    }
    
    function moveup(){
    if (iens6){
    var crossobj=document.getElementById? document.getElementById("content") : document.all.content
    var holder=document.getElementById? document.getElementById("container") : document.all.content
    var contentheight=crossobj.offsetHeight
    }
    else if (ns4){
    var crossobj=document.nscontainer.document.nscontent
    var holder=document.nscontainer
    var contentheight=crossobj.clip.height
    document.nscontainer.document.nscontent.visibility="show"
    }
    if (iens6&&parseInt(crossobj.style.top)<=0)
    crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
    else if (ns4&&crossobj.top<=0)
    crossobj.top+=speed
    moveupvar=setTimeout("moveup()",20)
    
    }
    
    function getcontent_height(){
    if (iens6){
    var crossobj=document.getElementById? document.getElementById("content") : document.all.content
    var holder=document.getElementById? document.getElementById("container") : document.all.content
    var contentheight=crossobj.offsetHeight
    }
    else if (ns4){
    var crossobj=document.nscontainer.document.nscontent
    var holder=document.nscontainer
    var contentheight=crossobj.clip.height
    document.nscontainer.document.nscontent.visibility="show"
    }
    }
    
    function MakeScroll(makewidth, makeheight) {
       if (iens6) {
    	document.write('<div id="Container" style="position:relative;width:'+makewidth+';height:'+makeheight+';border:1px solid black;overflow:hidden">')
    	document.write('<div id="Content" style="position:absolute;width:'+makewidth+';left:0;top:0">')
       } else {
    	document.write('<ilayer name="nsContainer" width='+makewidth+' height='+makeheight+' clip="0,0,100%,160">')
    	document.write('<layer name="nsContent" width='+makewidth+' height='+makeheight+' visibility=hidden>')
       }
    
    }
    
    function CloseScroll(){
       if (iens6) {
    		document.write('</div>')
    		document.write('</div>')
    	} else {
    		document.write('</ilayer>')
    		document.write('</layer>')
    	}
    }
    
    
    window.onload=getcontent_height
    </script>
    
    <body>
    <table border="0" width="500%" height="100%">
      <tr>
        <td width="100%" rowspan="3" height="100%">
    	<script>
    	MakeScroll("100%","100%")
    	</script>
    
    <!--INSERT CONTENT HERE-->
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <P> Random Assorted TExt</p>
    <!--END CONTENT-->
    
    	<script>
    	CloseScroll()
    	</script>
        <td align="center" width="11" valign="middle" height="20">
    	   <a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img src="up.gif" border=0 width="9" height="5"></a>  
        </td>
      </tr>
      <tr>
        <td align="center" width="11" valign="top" bgcolor="#C0C0C0">
        </td>
      </tr>
      <tr>
        <td align="center" width="11" valign="middle" height="20">
           <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)">
           <img src="down.gif" border=0 width="9" height="5"></a>
        </td>
      </tr>
    </table>
    </body>
    I'm using the table as a means of allowing the window to be resized on the fly and the scrollbar buttons get their settings on the fly as their being used so you can play with the window all you want and it will still scroll accurately.
    The hard part is finding out how to make a dragable object that can act as the thumb object on the scrollbar.. It'e wither do that or find a way to just read a mouse position off the area between the buttons... I honestly don't have a clue here and I've tried searching for one but so far...
    Nill.

    Any advice?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

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
  •