is there any way to make a div scrollable with overflow-y:hidden; and overflow-x:hidden?
i'm trying without success, maybe i need some js or jquery script?
i mean, i would like to make div scroll on y axes without showing scrollbar on right side( as it is now).
itryed:
.get-list{
position:absolute;
z-index:444;
text-align: center;
display: none;
bottom:0;
clear:both !important;
left:0;
right:0;
top:11%;
margin:0 auto;
background:#fff;
max-height:800px;
overflow-y:no-display;
overflow-x:hidden;
display: block;
}
thanks
EDIT
.log-widget-list{
position:absolute;
z-index:444;
text-align: center;
display: none;
width:99%;
margin:0 auto;
background:#fff;
height:800px;
overflow: hidden;
}
.log-widget-list .scroller{
overflow: scroll;
height:800px;
width:100%;
}
it shows right scrollbar anyway
is there any way to make a div scrollable with overflow-y:hidden; and overflow-x:hidden?
i'm trying without success, maybe i need some js or jquery script?
i mean, i would like to make div scroll on y axes without showing scrollbar on right side( as it is now).
itryed:
.get-list{
position:absolute;
z-index:444;
text-align: center;
display: none;
bottom:0;
clear:both !important;
left:0;
right:0;
top:11%;
margin:0 auto;
background:#fff;
max-height:800px;
overflow-y:no-display;
overflow-x:hidden;
display: block;
}
thanks
EDIT
.log-widget-list{
position:absolute;
z-index:444;
text-align: center;
display: none;
width:99%;
margin:0 auto;
background:#fff;
height:800px;
overflow: hidden;
}
.log-widget-list .scroller{
overflow: scroll;
height:800px;
width:100%;
}
it shows right scrollbar anyway
Share Improve this question edited Oct 3, 2012 at 21:45 Filippo oretti asked Oct 3, 2012 at 21:14 Filippo orettiFilippo oretti 49.8k96 gold badges229 silver badges351 bronze badges 9-
1
@SimpleCoder: I think OP has tried
overflow-y: hidden
andoverflow-x: hidden
, but that did not work. – Blender Commented Oct 3, 2012 at 21:15 - 2 If there is no scrollbar, how is it supposed to scroll? Automatically? – Cat Commented Oct 3, 2012 at 21:17
- 1 Yes you can by using jQuery.scrollLeft and jQuery.scrollTop. – Anoop Commented Oct 3, 2012 at 21:17
- 1 some trick to hide scroll bar i mean – Filippo oretti Commented Oct 3, 2012 at 21:17
- 1 @Ispuk You can use scrollTo(xpos,ypos); – Anoop Commented Oct 3, 2012 at 21:20
2 Answers
Reset to default 13Let's create a div with a width of 200px: (note the overflow:hidden
)
#sidebar{
width: 200px;
height: 300px;
border: 1px solid #000;
overflow: hidden;
}
Inside that div we will create the 'scrollable' div. See:
#sidebar #scroller{
width: 215px;
height: 300px;
padding-bottom: 15px;
overflow: scroll;
}
Altough we give it overflow:scroll
, the scrollbar isn't visible. This is because this div has a total width of 215px which will make the scrollbar disappear outside the div.
Also see: http://jsfiddle/TBsN8/
fixed as shown thanks to Sebass van Boxel
.log-widget-list{
position:absolute;
display: none;
width:98% !important;
top:11%;
max-height:500px;
overflow: hidden;
bottom:0 !important;
left:0;
right:0;
margin:0 auto !important;
}
.log-widget-list .scroller{
overflow: scroll;
max-height:500px;
padding-bottom:3%;
width:104% !important;
}