Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Nov 2006
    Location
    Washington, DC
    Posts
    30
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Question Scrolling Issues in FireFox

    Hi, I've already started a thread on fixing up my site but now that I've fixed most of the compatibility issues with IE. So this thread is just for this one issue I have left. Originally the overflow (below) is set to hidden but I was forced to change it to auto because if I don't, the bottom part of the site won't line up to the screen and get stuck below the screen. So now my only issue is that the result of changing the overflow to auto is that I have 2 set of scrolling area (1 is inside the other one). I don't like this cause it make the site behave a lot less smoothly in firefox.

    The CSS code I was describing is in the red.
    Code:
    html {
    height:100%; 
    max-height:100%; 
    padding:0px;
    margin:0px; 
    border:0px; 
    background:#000; 
    font-size:76%; 
    font-family:georgia, palatino linotype, times new roman, serif;
    /* hide overflow:hidden from IE5/Mac */ 
    /* \*/ 
    overflow: auto;
    /* */ 
    }
    
    body {height:100%; max-height:100%; overflow:hidden; padding:0px; margin:0px; border:0px;}
    
    #content {top:143px; left:100px; right:0px; bottom:0px; height:100%; max-height:100%; width:704px; overflow:auto; position:absolute; z-index:3;  background:#000;}
    
    * html #content {top:0px; left:0px; right:0px; bottom:0px; height:100%; max-height:100%; width:802px; overflow:auto; position:absolute; z-index:3; border-top:143px solid #000;  border-left:100px solid #000;}
    
    #head {position:absolute; margin:0px; top:0px; left:0px; display:block; width:804px; height:143px; background:url(http://i29.photobucket.com/albums/c275/Radscientist/websiteheaderwtext.jpg) #000; background-position:0 0; background-repeat:no-repeat; z-index:5; overflow:hidden; border:2px;  color:#000;}
    
    #left {position:absolute; left:0px; top:143px; bottom:50px; width:100px; font-size:1.2em; z-index:4; overflow:auto;}
    
    * html #left {height:100%; top:0px; bottom:0px; border-top:143px solid #000;  color:#000;}
    
    html,body {
    height:100%;
    margin:0px;
    padding:0px;
    border:0px; }
    
    body {
    padding-left:110px;
    font-family:Georgia, "Times New Roman", Times, serif;
    color:#FFF;
    background-color:#000; }
    
    hr {
    margin:0px;
    padding:0px;
    border:0px;
    border-bottom:2px solid #666666;
    line-height:0px;
    font-size:0px; }
    
    ul.navbar {
    list-style-type:none;
    margin:0px;
    padding:0px; }
    
    ul.navbar li {
    margin:5px;
    padding:2px; }
    
    ul.navbar li.spacer {
    background:none;
    margin:0px;
    padding:0px; }
    
    ul.navbar a, ul.navbar a:link,ul.navbar a:visited {
    text-decoration:none;
    color:#FFF; }
    
    ul.navbar a:hover {
    text-decoration:underline; }
    
    a, a:link, a:visited {
    text-decoration:underline;
    color:#FFF; }
    
    a:hover {
    text-decoration:none; }
    
    #sell {
    border:3px solid #FFFFFF;
    padding:5px;
    margin:3px; }
    
    #border {
    border:3px double #666666;
    padding:5px;
    margin:3px; }
    
    #content p {
    margin:0px;
    padding:5px;
    font-size:0.9em; }
    
    h2 {
    font-size:160%;
    margin:0px;
    padding:10px; }
    If you want to see my home page html to figure it out, here it is.
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Journey of Will Stroud</title>
    <link rel="stylesheet" href="mystyle.css">
    </head>
    <body>
    
    <div id="head">
    <img src="http://i29.photobucket.com/albums/c275/Radscientist/websiteheaderwtext.jpg" style="border:2px solid #666666;">
    </div>
    
    <div id="left">
            <ul class="navbar">
                    <li><a href="index.html">Home</a></li>
            </ul>
            <hr>
    	<ul class="navbar">
    		<li><a href="http://willjourney.16.forumer.com/">Forum</a></li>
    		<li><a href="http://theadventureofwillstroud.blogspot.com/">Blog</a></li>
    	</ul>
    	<hr>
    	<ul class="navbar">
    		<li><a href="http://www.freewebs.com">FreeWebs</a></li>
    		<li><a href="http://www.photobucket.com">PhotoBucket</a></li>
    	</ul>
    </div>
    <div id="content">
            <div align="center"><img src="http://i29.photobucket.com/albums/c275/Radscientist/americanwill-1-1.jpg" style="border:2px solid #666666;" alt=""></div>
    		<p>More Content (Info is below) will be created soon.</p><p>In the Meantime, Please go to either one of the link to the left for more informations on my journey.</p>
    
    <p>Site Map<br />* = Under Construction</p>
    
    <div id="border">
    <p><a href="http://www.freewebs.com/radscientist/">Home Page</a><img src="http://www.bayarea.net/~kins/AboutMe/GIFs/updated_animated.gif"></p>
    
    <div id="border">
    <p><a href="http://www.freewebs.com/radscientist/cal.html">Calender (With Daily Spending and Fitness calender now)*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/events.html">Special Events (with descriptions and possibly pictures)*</a></p>
    </div>
    
    <div id="border">
    
    <a href="http://www.freewebs.com/radscientist/deslist.html">List of Necessary Destinations and Wishlist of Destinations*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/general.html">General Destination Listing*</a></p>
    </div>
    
    <div id="border">
    <p><a href="http://www.freewebs.com/radscientist/money.html">Financing Watch*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/need.html">Items to buy*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/sell.html">Items to sell*</a><img src="http://www.bayarea.net/~kins/AboutMe/GIFs/updated_animated.gif"><br />
    
    <a href="http://www.freewebs.com/radscientist/needforlater.html">Items to buy later (with Wish-list)*</a><br />
    </div>
    
    <div id="border">
    <p><a href="http://www.freewebs.com/radscientist/fit.html">Fitness Planning & Progress*</a><br />
    </div>
    
    <div id="border">
    
    <a href="http://www.freewebs.com/radscientist/food.html">Culinary Practice (with Calender)*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/recipes.html">Favorite Recipes*</a><br />
    
    <a href="http://www.freewebs.com/radscientist/Bread.html">Bread Baking*</a><br />
    </div>
    
    </div>
    
    
           <p>Here is a quote of what I've written on some of the forums that I'm involved with. It basically explains what I am doing with this journey idea and why.</p>
    <div id="border">
    <p>Hi guys, I've been struggling a bit lately with what I want to do in my life cause I have been losing some interest in computers in general and have been learning (slowly) to cook and enjoy it. This have reminded my of a long phase of my life in middle school where I used to be intensly interested in one field for a few weeks then I move onto something else for a few weeks and I do this again and again. For instance, I was interested in geology for 2 weeks, then bird-watching for 3 weeks, then astrology (not the horoscope craps) for a few weeks. Now I don't really regret all of my time of interests cause it had gotten me to learn a little about many things but right now I feel that it is time for me to really consider what I want to do in my life and stay with it. The reason why I want to set-up this "journey" is because when I was younger and lived with my family, we used to travel a little (due to military transfer but we also traveled on the side too) and I've never really felt at home anywhere else as much as when I'm traveling.</p>
    
    <p>So I've decided that I will try to prepare myself as much as I can for a 2 month long (maximum) leisurly travel across America and possibly a short trek across the border into either Mexico or Canada (though i want to try Canada the most). This will also let me to see all of the sights and experiences everything I want to across America. Doing this will allow me to force myself to learn to interact with stranger in real life (I'm a little bit of a loner) and to expose myself to all different kind of situation which would allow me to see if there is anything I may have not tried that would be perfect for me to do.</p>
    
    <p>So far I'm just outlining the route (in my mind) I would like to take and figuring out what I need to get rid of and whatnot. (I'll just get rid of anything that I don't need and mail the sentimental items to the end destination for a friend to hold till then). The route I have in my mind so far is drawn out on the picture of a blank map of USA. The route so far are very "wandering" cause I don't have enough of destinations along the way yet which is why I posted here so I can find out about places to go to along the way</p>
    
    <p>Oh, another reason why the routes will wander a lot is that I will avoid the interstate as much as i can and use the back road to try and catch some hidden jewels such as a really homey mom and pop restaurant or some lesser-known museum such as the museum that was features on the "Ripley's believe it or not" that was dedicated to collecting all of the oldest computers.</p>
    
    <p>There are several large purchase I may have to make before I'll be ready for the trip and the biggest one of them all will be to purchase a Van for this travel. I plan to outfit and customize the interior into a kind of Mini-RV that I would call the RVan. I will draw and post a picture describing the general plan of the customization that would apply to most vans. The next biggest purchase may be a laptop for basic uses such as internet surfing and word-processing so I'll sell my computer once i'm ready to get a laptop.</p>
    
    <p>So far right now though, this is just the beginning of my outline and planning for the trip so I'll welcome any reasonable advices and idea for me to use I'm going to set up a trip journey on my site which will includes the planning.</p>
    
    <p>NOTES: Due to my slight financial unstability it may take me up to 2 years to save up for this trip if i run into any financial obstacle.</p>
    
    </div>
    </div>
    </body>
    </html>

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,748
    Thanks
    22
    Thanked 1,838 Times in 1,822 Posts
    Hello Radscientist,
    I'm not sure what your wanting to do. The bottom of your site goes below the screen when my browser is at the full size of a 24" widescreen LCD. I can't imagine it ever lined up?
    You've got several conflicting entries in your CSS. I cleaned it up a bit here:
    Code:
    html, body {
    background:#000; 
    font-size:90%; 
    font-family:georgia, palatino linotype, times new roman, serif;
    }
    *{ 
    padding:0px; 
    margin:0px; 
    }
    #head {
    width:804px; 
    height:143px; 
    background:url(http://i29.photobucket.com/albums/c275/Radscientist/websiteheaderwtext.jpg) #000; 
    border:2px;  
    color:#000;
    }
    #content {
    margin-left:100px; 
    width:704px; 
    background:#000;
    color: #fff
    }
    #left {
    float: left;
    width:100px; 
    font-size:1.2em;
    }
    hr {
    border-bottom:2px solid #666666;
    }
    
    ul.navbar {
    list-style-type:none;
    margin:0px;
    padding:0px; }
    
    ul.navbar li {
    margin:5px;
    padding:2px; }
    
    ul.navbar li.spacer {
    background:none;
    margin:0px;
    padding:0px; }
    
    ul.navbar a, ul.navbar a:link,ul.navbar a:visited {
    text-decoration:none;
    color:#FFF; }
    
    ul.navbar a:hover {
    text-decoration:underline; }
    
    a, a:link, a:visited {
    text-decoration:underline;
    color:#FFF; }
    
    a:hover {
    text-decoration:none; }
    
    #sell {
    border:3px solid #FFFFFF;
    padding:5px;
    margin:3px; }
    
    #border {
    border:3px double #666666;
    padding:5px;
    margin:3px; }
    
    #content p {
    margin:0px;
    padding:5px;
    font-size:0.9em; }
    
    h2 {
    font-size:160%;
    margin:0px;
    padding:10px; }
    I can't imagine any thread about fixing up your site not mentioning the errors in your code the validator shows. Only 10 errors and easily fixed.Have a look at the links in my sig below.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New Coder
    Join Date
    Nov 2006
    Location
    Washington, DC
    Posts
    30
    Thanks
    3
    Thanked 0 Times in 0 Posts
    I can't believe that I forgot to validate it

    I've looked at your link to the validator and it seems to have confused some of my border attribute with my div id="border". I've also tried using your code and what it did was pretty much destroyed the scrolling effect that I wanted. what I want to make the site do is to have the header image and the navbar stay in the same place while the content scrolls. what I was talking about is that rather than lining the bottom of the content scrollbar to the bottom of viewport, it extend like 140 px below it. see the arrow pointing to what I'm talking about below.



    Now look at the below image from the IE, you will see that the content scrollbar end at the bottom of the viewport and cause of this, I don't have a second scrollbar on the very right side of the screen. This is exactly what I'm trying to make in Firefox. Originally it had worked in Firefox but nothing was the way it needed to be in IE so I've hacked it as much as I can and I've finally managed to make it work for IE. But when I fixed this, the double scrollbar showed up in firefox.



    Thanks for the help though hopefully you understand now what I'm trying to achieve with my site.

    :EDIT: oh ok I've just looked more closely at the validator and it was validating my html of my home page. i thought that it was validating my css. sorry about the confusion. I'm looking into the div class feature to fix the repeating id="border" issue.

    :EDIT#2: thanks to the validator, I've found out how to use the class and so I've fixed all of the error on my site. I still have that double scrolling issue in firefox though

    :EDIT#3: I've fixed some of the conflicting issue in the CSS but I don't see any more in it so if you want, please let me know if I missed anything. see my CSS
    Last edited by Radscientist; 02-05-2007 at 11:09 PM.

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Try this
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Journey of Will Stroud</title>
    <style type="text/css">
    html {
    height:100%;
    border:0;
    background:#000;
    font-size:76%;
    font-family:georgia, palatino linotype, times new roman, serif;
    margin:0;
    padding:0;
    }
    
    body {
    height:100%;
    font-family:Georgia, "Times New Roman", Times, serif;
    color:#FFF;
    background-color:#000;
    border:0;
    margin:0;
    }
    
    #content {
    width:704px;
    background:#000;
    margin-left:100px;
    padding-top:153px;
    }
    
    #head {
    position:fixed;
    width:804px;
    height:143px;
    background:url(http://i29.photobucket.com/albums/c275/Radscientist/websiteheaderwtext.jpg) #000;
    background-position:0 0;
    background-repeat:no-repeat;
    border:2px;
    color:#000;
    left:0;
    top:0;
    }
    
    #left {
    position:fixed;
    left:0;
    top:143px;
    width:100px;
    font-size:1.2em;
    }
    
    hr {
    border:0;
    border-bottom:2px solid #666;
    line-height:0;
    font-size:0;
    margin:0;
    padding:0;
    }
    
    ul.navbar {
    list-style-type:none;
    margin:0;
    padding:0;
    }
    
    ul.navbar li {
    margin:5px;
    padding:2px;
    }
    
    ul.navbar li.spacer {
    background:none;
    margin:0;
    padding:0;
    }
    
    ul.navbar a,ul.navbar a:link,ul.navbar a:visited {
    text-decoration:none;
    color:#FFF;
    }
    
    ul.navbar a:hover {
    text-decoration:underline;
    }
    
    a,a:link,a:visited {
    text-decoration:underline;
    color:#FFF;
    }
    
    a:hover {
    text-decoration:none;
    }
    
    #sell {
    border:3px solid #FFF;
    margin:3px;
    padding:5px;
    }
    
    .border {
    border:3px double #666;
    margin:3px;
    padding:5px;
    }
    
    #content p {
    font-size:0.9em;
    margin:0;
    padding:5px;
    }
    
    h2 {
    font-size:160%;
    margin:0;
    padding:10px;
    }
    
    </style>
    <!--[if lte IE 6]>
    <style type="text/css">
    html {
    overflow-x:hidden;
    overflow-y:hidden;
    }
    body {
    overflow-y:auto;
    }
    #head, #left {
    position:absolute;
    }
    </style>
    <![endif]-->
    </head>
    <body>
    <div id="head"> <img src="http://i29.photobucket.com/albums/c275/Radscientist/websiteheaderwtext.jpg" style="border:2px solid #666666;" alt="header image"> </div>
    <div id="left">
    	<ul class="navbar">
    		<li><a href="index.html">Home</a></li>
    	</ul>
    	<hr>
    	<ul class="navbar">
    		<li><a href="http://willjourney.16.forumer.com/">Forum</a></li>
    		<li><a href="http://theadventureofwillstroud.blogspot.com/">Blog</a></li>
    	</ul>
    	<hr>
    	<ul class="navbar">
    		<li><a href="http://www.freewebs.com">FreeWebs</a></li>
    		<li><a href="http://www.photobucket.com">PhotoBucket</a></li>
    	</ul>
    </div>
    <div id="content">
    	<div align="center"><img src="http://i29.photobucket.com/albums/c275/Radscientist/americanwill-1-1.jpg" style="border:2px solid #666666;" alt="american will"></div>
    	<p>More Content (Info is below) will be created soon.</p>
    	<p>In the Meantime, Please go to either one of the link to the left for more informations on my journey.</p>
    	<p>Site Map<br>
    		* = Under Construction</p>
    	<div id="border">
    		<div class="border">
    			<p><a href="http://www.freewebs.com/radscientist/">Home Page</a><img src="http://www.bayarea.net/~kins/AboutMe/GIFs/updated_animated.gif" alt="updated"></p>
    			<div class="border">
    				<p><a href="http://www.freewebs.com/radscientist/cal.html">Calender (With Daily Spending and Fitness calender now)*</a><br>
    					<a href="http://www.freewebs.com/radscientist/events.html">Special Events (with descriptions and possibly pictures)*</a></p>
    			</div>
    			<div class="border">
    				<p><a href="http://www.freewebs.com/radscientist/deslist.html">List of Necessary Destinations and Wishlist of Destinations*</a><br>
    					<a href="http://www.freewebs.com/radscientist/general.html">General Destination Listing*</a></p>
    			</div>
    			<div class="border">
    				<p><a href="http://www.freewebs.com/radscientist/money.html">Financing Watch*</a><br>
    					<a href="http://www.freewebs.com/radscientist/need.html">Items to buy*</a><br>
    					<a href="http://www.freewebs.com/radscientist/sell.html">Items to sell*</a><img src="http://www.bayarea.net/~kins/AboutMe/GIFs/updated_animated.gif" alt="updated"><br>
    					<a href="http://www.freewebs.com/radscientist/needforlater.html">Items to buy later (with Wish-list)*</a><br>
    			</p>
    			</div>
    			<div class="border">
    				<p><a href="http://www.freewebs.com/radscientist/fit.html">Fitness Planning &amp; Progress*</a><br>
    			</p>
    			</div>
    			<div class="border">
    				<p><a href="http://www.freewebs.com/radscientist/food.html">Culinary Practice (with Calender)*</a><br>
    					<a href="http://www.freewebs.com/radscientist/recipes.html">Favorite Recipes*</a><br>
    					<a href="http://www.freewebs.com/radscientist/Bread.html">Bread Baking*</a><br>
    				</p>
    			</div>
    		</div>
    		<p>Here is a quote of what I've written on some of the forums that I'm involved with. It basically explains what I am doing with this journey idea and why.</p>
    		<div class="border">
    			<p>Hi guys, I've been struggling a bit lately with what I want to do in my life cause I have been losing some interest in computers in general and have been learning (slowly) to cook and enjoy it. This have reminded my of a long phase of my life in middle school where I used to be intensly interested in one field for a few weeks then I move onto something else for a few weeks and I do this again and again. For instance, I was interested in geology for 2 weeks, then bird-watching for 3 weeks, then astrology (not the horoscope craps) for a few weeks. Now I don't really regret all of my time of interests cause it had gotten me to learn a little about many things but right now I feel that it is time for me to really consider what I want to do in my life and stay with it. The reason why I want to set-up this &quot;journey&quot; is because when I was younger and lived with my family, we used to travel a little (due to military transfer but we also traveled on the side too) and I've never really felt at home anywhere else as much as when I'm traveling.</p>
    			<p>So I've decided that I will try to prepare myself as much as I can for a 2 month long (maximum) leisurly travel across America and possibly a short trek across the border into either Mexico or Canada (though i want to try Canada the most). This will also let me to see all of the sights and experiences everything I want to across America. Doing this will allow me to force myself to learn to interact with stranger in real life (I'm a little bit of a loner) and to expose myself to all different kind of situation which would allow me to see if there is anything I may have not tried that would be perfect for me to do.</p>
    			<p>So far I'm just outlining the route (in my mind) I would like to take and figuring out what I need to get rid of and whatnot. (I'll just get rid of anything that I don't need and mail the sentimental items to the end destination for a friend to hold till then). The route I have in my mind so far is drawn out on the picture of a blank map of USA. The route so far are very &quot;wandering&quot; cause I don't have enough of destinations along the way yet which is why I posted here so I can find out about places to go to along the way</p>
    			<p>Oh, another reason why the routes will wander a lot is that I will avoid the interstate as much as i can and use the back road to try and catch some hidden jewels such as a really homey mom and pop restaurant or some lesser-known museum such as the museum that was features on the &quot;Ripley's believe it or not&quot; that was dedicated to collecting all of the oldest computers.</p>
    			<p>There are several large purchase I may have to make before I'll be ready for the trip and the biggest one of them all will be to purchase a Van for this travel. I plan to outfit and customize the interior into a kind of Mini-RV that I would call the RVan. I will draw and post a picture describing the general plan of the customization that would apply to most vans. The next biggest purchase may be a laptop for basic uses such as internet surfing and word-processing so I'll sell my computer once i'm ready to get a laptop.</p>
    			<p>So far right now though, this is just the beginning of my outline and planning for the trip so I'll welcome any reasonable advices and idea for me to use I'm going to set up a trip journey on my site which will includes the planning.</p>
    			<p>NOTES: Due to my slight financial unstability it may take me up to 2 years to save up for this trip if i run into any financial obstacle.</p>
    		</div>
    	</div>
    </div>
    </body>
    </html>
    I made your #head and #left divs position:fixed. Unfortunately IE6 doesn't support position:fixed however one of its other bugs allows you to emulate this. The downside is now anything position:absolute; or position:relative; becomes "position:fixed" in IE6. IE7 supports position:fixed;.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    New Coder
    Join Date
    Nov 2006
    Location
    Washington, DC
    Posts
    30
    Thanks
    3
    Thanked 0 Times in 0 Posts
    cool, that code seems to work except for the fact that by having the scrollbar on the far right (instead just on the right side of the content are) seems to make the scrolling a lot slower than usual for some reason. This make it difficult to get a feel of the flow on my site. I'm currently trying to dissect your provided code to see what you did to fix it. maybe I can come up with something to make the scrollbar show up on the right side of the content area.

    Thanks for the code, aerospace eng.

    :EDIT:
    try comparing both the home page (with current code) and the test page (with your code) to see what I mean.
    http://www.freewebs.com/radscientist/
    http://www.freewebs.com/radscientist/test.html
    Last edited by Radscientist; 02-05-2007 at 11:30 PM.

  • #6
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    You aren't going to get the same effect without using javascript. The reasoning behind the way I did it was because users are familiar with the scrollbar being where it should be, on the far right, not next to the content. Also the scrollwheel doesn't work sometimes when trying to scroll the content using the scrollbar on a div with overflow properties set. The scroll wheel works just fine on my example. I also don't notice anything slow.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #7
    New Coder
    Join Date
    Nov 2006
    Location
    Washington, DC
    Posts
    30
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    You aren't going to get the same effect without using javascript. The reasoning behind the way I did it was because users are familiar with the scrollbar being where it should be, on the far right, not next to the content. Also the scrollwheel doesn't work sometimes when trying to scroll the content using the scrollbar on a div with overflow properties set. The scroll wheel works just fine on my example. I also don't notice anything slow.
    ok thanks for the code right now I'm trying to figure out how to externalize the CSS in the code that you gave me while keeping my original one to experiment on some more. Turned out that the slow speed was attributed to the smooth-scrolling effect being enabled. About the javascript, I thought that I won't need it since it had worked exactly like I want it to in IE now. Guess I'll have to get used to the scroll bar being on the far right. at least it won't "squeeze" the content too much. I'll be editing all of my html site to includes your codes for now till I figure your code out. (I want to learn how it work too )


  •  

    Posting Permissions

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