Geek asks and answers

How to create a scroll bar?

Here is what I am trying to do. I want a div that appears as a box of fixed dimensions into which various javascript functions will place text over time. When the number of lines of text exceeds the height of the window, I would like a scroll bar to appear next to the field, so that you can scroll the text inside it, while the box itself remains a fixed height.

How can I do that?

+3
source share
5 answers

using css you can do this:

div{
   overflow-y: scroll
}

you can also overflow-y: autolike @ tw16

+6
source

As you say, the scrollbar should only appear if there is too much text, I would use:

div{
    overflow-y: auto
}

: http://jsfiddle.net/RMpFu/

+4

overflow CSS:

document.querySelector("div").style.overflowY = "scroll";  //For Y
document.querySelector("div").style.overflowX = "scroll";  //For X

document.querySelector("div").style.overflow = "scroll";   //For both ;)

P.S.

, , :

document.querySelector("div").style.overflow = "auto";    //JavaScript

//-or-

div{
    overflow: auto;                       /*CSS*/
}
+3
<script type="text/javascript">
$(function() { 
   $('.holeEvent').hover(function() {
      $(this).removeClass('holeEvent').addClass('holeEvent2');
   },
   function(){
      $(this).removeClass('holeEvent2').addClass('holeEvent');
   });
});
</script>
0
source 
<style type="text/css">
.holeEvent {
   height: 50px;
   overflow-y: hidden;
}
.holeEvent2 {
   height: 50px;
   overflow-y: scroll;
}
</style>

<div class="holeEvent2"></div>
0
source

More articles:


All Articles