Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Aug 2004
    Posts
    13
    Member #
    7044
    Hi,

    I've recently added a mini-scroll bar to my site (actually two.) This is sth that I'd been meaning to do for a while and I finally found some code on dynamic drive:
    http://dynamicdrive.com/
    a very good site for source code.

    I'm having difficulty putting a third scroll bar in, however. I got it right once, but forgot to save the code. Frankly, I don't know what I did.

    Basically if you look at section 28 of the Venn diagram that makes up my site's first page you will see that it is scrollable, I'm trying to do the same for section 31.

    I can't understand why putting two scrollbars in is OK, but three causes problems.

    I think this site:
    http://www.htmlgoodies.com/tutors/textonimages.html

    may hold the key to the problem, but I'm not sure how.

    If you know how to solve the problem, please let me know. Thanks. :classic:

    Andy
    http://www.geocities.com/endipatterson/Catenative.html

  2.  

  3. #2
    Senior Member jlgosse's Avatar
    Join Date
    Jan 2004
    Location
    Newfoundland, Canada
    Posts
    1,037
    Member #
    4570
    Liked
    7 times
    An easy way to make "extra" scrollbars is to use <div> tags with the style attribute overflow.

    An example would be:
    HTML Code:
    <div style="width:300px; height:200px; overflow:auto; border:1px solid black; background-color: #FFF;">
         Your text that must make the box larger than what it is now, goes here!</div>


  4. #3
    Junior Member
    Join Date
    Aug 2004
    Posts
    13
    Member #
    7044
    Quote Originally Posted by jlgosse
    An easy way to make "extra" scrollbars is to use <div> tags with the style attribute overflow.

    An example would be:
    HTML Code:
    <div style="width:300px; height:200px; overflow:auto; border:1px solid black; background-color: #FFF;">
         Your text that must make the box larger than what it is now, goes here!</div>

    Thanks, I'll play arround with that. I'm thinking ahead here, though, and you mentioned that the text itself makes the box larger. I need to have a box of a very definite size and shape because it must fit inside a Venn diagram or are you talking about it's maximum size. Did you look at the site btw? I suppose I had better list the actual code that I used from that portion os the website. It correspondes to section 28 of the diagram on my site:

    <DIV STYLE="position:absolute; top:1670px; left:260px; width:120px; height:25px">
    <Left><FONT SIZE="-1" COLOR="black"><center><ilayer name="scroll1" width=170 height=150 clip="0,0,170,150">
    <layer name="scroll2" width=500 height=150 bgColor="New tan">
    <div id="scroll3" style="width:135px;height:230px;background-color:new tan;overflow:scroll"
    <JUSTIFY>
    <b>a) Single word,<br>
    Negated, modalised<br>
    or idiomatic verbs:</b><br>
    Admit<br>
    Adore<br>
    Avoid<br>
    Can't help<br>
    Can't stand<br>
    Come<br>
    Complete<br>
    Consider<br>
    Delay<br>
    Deny<br>
    Detest<br>
    Dislike<br>
    Don't mind<br>
    Enjoy<br>
    Finish<br>
    Forgive<br>
    Forbid<br>
    Go<br>
    Imagine<br>
    Keep<br>
    Mind<br>
    .
    .
    .
    be angry about<br>
    be upset about<br>
    be worried about<br>
    <br>
    <BR><BR></TD></TR></JUSTIFY></left>
    </div>
    </layer>
    </ilayer>

    <script>

    /***********************************************
    * Scrollable content Script- Dynamic Drive (www.dynamicdrive.com)
    * This notice must stay intact for use
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/

    var nsstyle='display:""'
    if (document.layers)
    var scrolldoc=document.scroll1.document.scroll2
    function up(){
    if (!document.layers) return
    if (scrolldoc.top<0)
    scrolldoc.top+=10
    temp2=setTimeout("up()",50)
    }
    function down(){
    if (!document.layers) return
    if (scrolldoc.top-150>=scrolldoc.document.height*-1)
    scrolldoc.top-=10
    temp=setTimeout("down()",50)
    }

    function clearup(){
    if (window.temp2)
    clearInterval(temp2)
    }

    function cleardown(){
    if (window.temp)
    clearInterval(temp)
    }

    </script>
    <br><span style="display:none" style=&{nsstyle};><a href="#" onMousedown="up()"
    onMouseup="clearup()" onClick="return false" onMouseout="clearup()">Up</a> | <a href="#"
    onMousedown="down()" onMouseup="cleardown()" onClick="return false"
    onMouseout="cleardown()">Down</a> | <a href="#" onClick="if (document.layers) scrolldoc.top=0;return false">Top</a> | <a href="#" onClick="if (document.layers) scrolldoc.top=scrolldoc.document.height*(-1)+150;return false">Bottom</a></span>
    </FONT></Left>
    </DIV>

    Significantly, I notice that your code is much shorter. It seems that the <DIV> tag is important here, you give the size, I must presumably give the location too. I'm not sure what the overflow and position absolute tag (that I used) does, if it isn't absolute what is it relative? Anyway, I'll play with the (thankfully much simpler code) and see what happens.

    Thank you very much.

    Andy
    <www.geocities.com/endipatterson/Catenative.html>


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:12 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com