HTML - Another Question.. Scroll Box
I am trying to make a very specific scroll box for one of my websites. I have the box html done but what I need to know is how to change the scroll bar to a custom scroll bar. You'll see what I mean if you look at the site. (its ugly and doesnt look right)
Heres where the site is hosted for now. www.legrandmotorsports.com/photography The section I want the scrolling area to be is in the red box under the upcoming events. I also do not want the horizontal scrolling. Heres the html so far... <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Scroll Box</title> </head> <body> <div style="overflow:auto; height:100px; width:250px"> <table cellpadding="0" cellspacing="0" style="width:250px;"> <tr> <td>TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST</td> </tr> </table> </div> </body> </html> Any help is grately appreciated. Thanks Similar TutorialsCan anyone help me out? I've set up a test site for a project where I have a scrollable table within an iFrame. Techincally, its an iFrame within an iFrame which gets you to a scrollable table I also added an auto-scroll with anchor-links. Everything finally works, but I really want to remove the horizontal-scroll bar that shows up, while keeping the vertical-scroll bar. (Upon testing, I found without the vertical-scroll bar, the anchor-links and auto-scroll don't work correctly.) here's the link to the test site: http://www.thegrandamerican.com/ here's the line of code I think is the correct place to make corrections: <iframe id="myiframe" name="myiframe" src="oprah june 09_news.htm" width="900" height="475" scrolling="yes" overflow-y: scroll></iframe> The hierarchy works as follows: index.htm > spotlight_news.htm > oprah june 09_news.htm The reason for all the iframes is to have elements on the higher pages that will stay in place, such as a music player and dynamic menu bar. other notes and associated files (for the auto scroll) a smooth-src-comments.js smooth.pack.js Thanks. - J Ive been looking EVERYWHERE for a site with a code for a scroll box with a trasparent scroll bar, Ive seen the code where I can edit the size of the box as well as the color of the box itself and I know how to do THAT. how do I make it where the code displays the scroll code as well so I can fully customize it? it seems that its always hidden.. hi i have a large text i want to make it into a scroll bar and i want it to be set up like how i typed it and i really need help on this Trying to create a simple scrolling for fitting my template. sample: http://www.hottunaint.com/press1.html template sample to fit in the main panel (image size) http://www.hottunaint.com/product.html thanks I have looked through thousands of templates and this is the only one I like. The only problem is I hate the orange thing in the middle keeps moving up and down as I scroll the page. Can somebody download a copy and tell me how to make the orange thing in the middle static so it never scrolls, thanks. http://www.free-css.com/free-css-tem....php#bookmarks Im developing a homepage, www.hallevikslagret.se My problem is, when your using a small resolution or if you make the browserwindow to small the menu at the top disapears. Ive tried many different ways to show a scroll but i cant solve it. How do i get a scroll when the content gets to big. I know that im not using correct XHTML-language on the page. I will get to that as soon as possible when i solve this problem. Thank you for your time! Best Regards Jens Hello. I'm currently trying to help my friend develop his website. He wants to put a banner that's linked back to his site, and then underneath a scroll box which contains the code to put the banner in anywhere. The problem is, whenever I try, and I put the code in the scroll box, it shows the banner, instead of the actual code. How can I stop the banner from showing up? Thank you I had the problem of my page shifting to the right whenever it was too long for the window to allow a scroll bar so I added this overflow-y:scroll; to the body information in the css sheet. It works fine in most browsers but I've noticed that with IE7 the scroll appears in the top part of the margin and not on the browser side. It just doesn't look right. Please advise. Here's the link. http://www.yotti.de/indextemp.html Ok I have a dive that scrolls and when i scroll it, it goes behind another div, which is what i want , but the problem is i don't want it to apear on the other side of the div but i still want to see the background. so i was wondering if there is a way i can make the scrolling div go behind another div that is invisible or something and make the scrolling div go invisible at this section so you can still see the rest of the scrolling div, but not the part behind the invisble div. if someone knows how to do this or a more simple way, that does not involve changing the size of the scrolling div as i want the scrollbar to be the height of the page. I've created a simple layout for a myspace and want to post the code on my 'myspace'. I want to put the code into a scroll box where if you click on the box it automatically highlights the whole box. Can somebody please give me a code for such a box. Here is my layout code. Code: <div style="width:200px;height:200px;overflow:auto;border-width:2px;border-color:000000;border-style:solid;"> <strong>Halo Layout</strong><br> <style type='text/css'>body{background-color:FFFFFF;background-image:url('http://aycu01.webshots.com/image/12280/2002524089993516905_rs.jpg');background-repeat:repeat;background-attachment:Fixed;background-position:Top Left;border-color:ff0000;border-width:2;border-style:Ridge;scrollbar-face-color: cccccc;scrollbar-track-color: 000000;scrollbar-arrow-color: ffffff;scrollbar-shadow-color: undefined;scrollbar-3dlight-color:undefined;scrollbar-darkshadow-color:undefined;scrollbar-highlight-color: 000000;cursor:url('Paste Url or Choose one Below'), default};color:000000 !important;font-family:Verdana;}table, tr, td{background:transparent;border:0px;}table table table{border:2 Solid 000000; background-color:}table table table table{border:0px;border-style:;}table table table td{background-image:url('');background-color:996600;filter:alpha(opacity=99);-moz-opacity:.99; opacity:.99; -khtml-opacity:99}table, tr, td, th, li, p, div{font-family:Arial,Helvetica,Sans-Serif;color:000000;font-size:12;font-style:none}.nametext, .whitetext12, .btext, .orangetext15, .redtext, .redbtext{font-family:Arial,Helvetica,Sans-Serif;color:993300;font-size:14;font-weight:bold;font-style:none}.blacktext12, .text, .lightbluetext8{font-family:Arial,Helvetica,Sans-Serif;color:000000;font-size:12;font-style:none}a:active, a:visited, a:link{color:000000;font-family:Arial,Helvetica,Sans-Serif;font-size:12;font-style:none}a:hover{font-family:Arial,Helvetica,Sans-Serif;font-size:12;color:999999;font-style:none}a.navbar:active, a.navbar:visited, a.navbar:link{color:000000;font-family:Arial,Helvetica,Sans-Serif;font-size:12;font-style:none}a.navbar:hover{color:999999;font-family:Arial,Helvetica,Sans-Serif;font-size:12;font-style:none}img{border:0;}Table, Td{background-color:transparent;}table table table{width:100%;background-color:transparent;}.netlogo{padding-top:0px;position:absolute;z-index:7;width:45px;height:45px;left:95%;top:12px;text-align:center;background-color:transparent;color:E67070;}</style><style type='text/css'>table table table td{vertical-align:top}span.blacktext12{visibility:visible !important;background-color:transparent;background-image:url();font-size:12px;letter-spacing:1px;width:435px;height:75px;display:block}span.blacktext12 img{display:none;}</style><div class="netlogo">&nbsp;</div><br> <style type="text/css"> .contactTable { width:300px !important; height:150px !important; background-image:url("http://aycu34.webshots.com/image/12673/2002531323961939314_rs.jpg"); background-repeat:no-repeat; background-color:transparent; background-attachment:scroll; background-position:center center; padding:0px !important;} .contactTable table, table.contactTable td { background-color:transparent; background-image:none; padding:0px !important;} .contactTable a img {visibility:hidden; border:0px !important;} .contactTable .text {font-size:1px !important;} </style><br/><div style="position:absolute;left:100px;top:45px;width:120px;height:46px;">&nbsp;</div></p> </div> Its pretty tricky because myspace thinks it is the layout itself.Thanks in advance In this TD i am not able to see all of the information....how do i add scroll bars??? <td class="DetailsContents" style="overflow:scroll"> <asp:Literal ID="litLogDetail" runat="server" /> </td> .DetailsContents { font-family:Verdana; font-size:11px; background-color:white; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; color:#333333; vertical-align:top; overflow:scroll; height:800px; } [removed] Can someone please let me know what is wrong? I know I can make every page load separately but I will lose the jFlow slide script. I really appreciate any advice I can get. This has been troubling me for a long time. HEllo Friends, I am newbie to HTML, I Am trying toa dd a scroll bar to a HTML but couldt do so. Please help me. heres the code for the page <!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>Stunting Souls - The Hell of Power</title> <style type="text/css"> <!-- body { background-image: url(); background-color: #000000; scrollbar-face-color:#DBDBDB; scrollbar-shadow-color:#DBDBDB; scrollbar-highlight-color:#DBDBDBC; scrollbar-3dlight-color:999999; scrollbar-darkshadow-color: 000000; scrollbar-track-color:000000; scrollbar-arrow-color:#333333; color: #FFFFFF; } a:link { color: #FFFFFF; text-decoration: none; } a:visited { text-decoration: none; color: #FFFFFF; } a:hover { text-decoration: underline; color: #FFFFFF; } a:active { text-decoration: none; color: #FFFFFF; } body { background-color: #000000; } --> </style> <link href="style.css" rel="stylesheet" type="text/css"> <style type="text/css"> <!-- .style1 {color: #FFFFFF} .style2 {font-size: 9px} --> </style> </head> <body> <table width="781"> <tr> <td width="773" height="35"><table width="30"> <tr> <td> </td> <td><object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="763" height="115"> <param name="movie" value="menu1.swf"> <param name="quality" value="high"> <embed src="menu1.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="763" height="115"></embed> </object></td> </tr> </table></td> </tr> <tr> <td><table width="200"> <tr> <td> </td> <td><object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="763" height="262"> <param name="movie" value="header.swf"> <param name="quality" value="high"> <embed src="header.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="763" height="262"></embed> </object></td> </tr> </table></td> </tr> <tr> <td> </td> </tr> <tr> <td><table width="742"> <tr> <td width="219" height="99" class="lt_text"> <table width="200" height="83"> <tr> <td height="17" class="lt_text"><img src="images/t1.gif" width="223" height="32"></td> </tr> <tr> <td width="191" height="17" class="lt_text"><img src="images/back.gif" width="21" height="7"><a href="safe.htm">Safe Riding Tips </a></td> </tr> <tr> <td height="18" class="lt_text"> <img src="images/back.gif" width="21" height="7"><a href="helmet">Helmet Buying Guide</a> </td> </tr> <tr> <td height="19" class="lt_text"> <img src="images/back.gif" width="21" height="7"><a href="night.htm">Tips for Riding in Nigh</a>t </td> </tr> <tr> <td class="lt_text"> <img src="images/back.gif" width="21" height="7"><a href="rain">Monsoons and Motorbikes</a></td> </tr> </table></td> <td width="318"><table width="318" height="63"> <tr> <td><div align="center" class="m_text"> Wallpaper of The Month </div></td> </tr> <tr> <td height="36"> </td> </tr> </table></td> <td width="189"> </td> </tr> </table></td> </tr> <tr> <td><div align="center" class="h1_text"> <p class="h_text style1"> </p> </div></td> </tr> <tr> <td class="m_text"><div align="center"><span class="l_text">Copyright© stuntingsouls.com. All Right reserved. </span></div></td> </tr> <tr> <td class="m_text"><span class="m_text">Website Design: Aman Singh (.A.D.S.) (Layout Designer, Graphics Designer, Coder, Administrator) & Fatima Boura, France (Logo and Graphics Designer) </span></td> </tr> <tr> <td class="m_text"><div align="center"><span class="h_text style1"><img src="images/excyellow_tri.gif" width="21" height="18" align="bottom"><span class="style2">Please do not Try any of the stunts/activities shown here in. These Stunts are performed by Professionals within a controlled enviornment. Doing/Trying these stunts may harm you and may cause you a major injury. </span></span></div></td> </tr> </table> </body> </html> Hi guys, The first page of my website is very short and so there is no scroll bar at the right. The next page is longer and there is a scroll bar. This leads to the body of my site shifting slightly to the left/right between pages where there is/isn't a scroll bar. (example: www.runyourownrestaurant.com) To fix this, I want to put a scroll bar on the right on pages even where it doesn't need one. Kind of a scroll bar that doesn't scroll. I have seen this before, but I'm not sure how to make it. Can anyone help please? Thank you! How do i change the color? and "Style" i guess. I have seen it alot, i have been going through alot of source code, but i havent found it yet. I do have a css for my website so if it goes in there, let me know also. I'm just wondering, is it possible to stop the main page from scrolling down, and instead, add the scroll bar in the table cell that i want it in. if it is possible...what is the code i can use to operate this? help much appriciated... ^-^ Anchieh hey how can i make a scroll box with html code inside it i have the code for a scroll box but i dont know how to make my scroll appears with the html code inside so others copy my html for posting it 1. I am having the JSP page which uses some css files . 2. i just want to avoid the scroll bar if content of my page is more . 3. How can i do that? Is there any way for me to hide the scroll bar? Any way to lock it? -------------------------------------------------------------------------------- I'm hoping someone has fresher eyes than I do. I've been working on this for nearly 3 hours and just can't figure out what is wrong. the page works great in firefox, chrome, but in IE 7 it does not like me at all. I'm getting no scroll bars and the page stops at one of the fields rather than continuing to the end of the page. Can you help? Here is the page, thanks. http://www.sentrylogin.com/sentry/me...40&Ppl_ID=2977 Laura |