iframe scrollbar help: keeping vertical scrollbar visible

  • joe rodriguez
  • Born
  • Born
  • joe rodriguez
  • Posts: 4
  • Loc: wareham ma

Post 3+ Months Ago

hi,

http://www.throughwords.com

i'm using iframes and i would like to keep the vertical scrollbar visible(greyed out of use) even when there is not enough content for the scrollerbar to be needed.

i know that scrollbars="yes" will do this but the horizontal one will also appear.

is there anyway to do this?
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

From my experience with scrollbars, it's either all or none :-\

I always hoped there would be a way to disable one or the other, but as it stands, you gotta design to fit in the area you're trying to fit in.
  • krs-wan
  • Born
  • Born
  • krs-wan
  • Posts: 1

Post 3+ Months Ago

you could try the overflow css property
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

That doesn't hide horizontal scrolling. It shows all, hides all, or auto show/hides all.

The impression I got was that they wanted to always show vertical scrolling, but never show horizontal.

Given that by default the scrollbars are on this isn't a problem. However, if the content overflows horizonally, it would be a problem, but you can't hide one or the other.
  • joe rodriguez
  • Born
  • Born
  • joe rodriguez
  • Posts: 4
  • Loc: wareham ma

Post 3+ Months Ago

ok, thanks for your help anyways,
  • lilcutie009
  • Novice
  • Novice
  • User avatar
  • Posts: 20
  • Loc: UK

Post 3+ Months Ago

I found this code a while back on my page.. no idea how it got there but it's quite handy! It allows you to disable or enable scrollbars on the horzontal and vertical axes as you please!! To enable keep scroll where it says scroll and to disable type hidden!

Hope this helps... let me know how you get on!!

Code: [ Select ]
<style type="text/css">
<!--
.mouse
{
position:absolute;
visibility:visible;
top:-50px;
font-size:10px;
font-family:tahoma;
color:pink;
}
body
{
width:100%;
overflow-x:scroll;
overflow-y:scroll;
}
-->
</style>
  1. <style type="text/css">
  2. <!--
  3. .mouse
  4. {
  5. position:absolute;
  6. visibility:visible;
  7. top:-50px;
  8. font-size:10px;
  9. font-family:tahoma;
  10. color:pink;
  11. }
  12. body
  13. {
  14. width:100%;
  15. overflow-x:scroll;
  16. overflow-y:scroll;
  17. }
  18. -->
  19. </style>
  • lostinbeta
  • Guru
  • Guru
  • User avatar
  • Posts: 1402
  • Loc: Philadelphia, PA

Post 3+ Months Ago

overflow-x and overflow-y are IE only CSS properties. IE actually went the right way here, but once again they choose to do their own thing, which screws everything up for cross browser compatibility.

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 16 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.