html - Hide scroll bar, but while still being able to scroll -


i want able scroll through whole page, without scrollbar being shown.

in google chrome it's:

::-webkit-scrollbar {      display: none;  } 

but mozilla firefox , internet explorer don't seem work that.

i tried in css:

overflow: hidden; 

that hide scrollbar, cant scroll anymore.

is there way can remove scrollbar , still being able scroll whole page? css or html, please.

just test working fine.

#parent{     height: 100%;     width: 100%;     overflow: hidden; }  #child{     width: 100%;     height: 100%;     overflow-y: scroll;     padding-right: 17px; /* increase/decrease value cross-browser compatibility */ } 

working fiddle

javascript:

since, scrollbar width differs in different browsers, better handle javascript. if element.offsetwidth - element.clientwidth, exact scrollbar width show up.

javascript working fiddle

or

using position: absolute,

#parent{     height: 100%;     width: 100%;     overflow: hidden;     position: relative; }  #child{     position: absolute;     top: 0;     bottom: 0;     left: 0;     right: -17px; /* increase/decrease value cross-browser compatibility */     overflow-y: scroll; } 

working fiddle

javascript working fiddle

info:

based on answer, created simple scroll plugin. hope someone.


Comments

Popular posts from this blog

blackberry 10 - how to add multiple markers on the google map just by url? -

php - guestbook returning database data to flash -

delphi - Dynamic file type icon -