How to style the general scroll bar of the site?

Asked

Viewed 333 times

0

I was looking at some templates online and I was curious about this one. His scroll bar is not part of the browser so I see it but the DOM.

How is that?

javascript css dom

  • What do you want? http://css-tricks.com/custom-scrollbars-in-webkit/

  • @Felipe Stoker, so the n scrollbar is part of the browser?

  • 1

    This site of the question body is simulating a scrollbar. My browser here in Sopt does not appear in the DOM, that of this site yes. In this case, the link of Felipe Stoker shows a particularity a certain engine in putting the elements inside the DOM in an "unofficial" way, and nothing guarantees that one day this will be used by any other browser, and if it is, each one can do their own way.

  • 3

    I even tested that site here and it’s awful to roll the screen with scroll wheel mouse by the fact that the guys have reimplemented the functionality that should be the original bar.

  • @Bacco Yes, this theme is good but this scroll bar is tense.

  • @Bacco, is it permissible to post questions on non-technical topics? Like a reflection on the T.I market, something like that...

  • 1

    My advice is, never change something that is of the user (the user customizes his browser as he likes), he may not like your forced customization and find an insult, I know several who would be outraged, including me.

Show 2 more comments

1 answer

1

On the site in question, the plugin was used Nicescroll (jQuery).

Summarizing the operation: it puts a overflow: hidden on the tag html to disappear the browser bars and create a "fake" scroll bar; a div which behaves like a bar. And then it does the scroll manually, detecting the events mousewheel and scrolling, probably with jQuery, through scrollTop().

Although it is more beautiful, it decreases the performance beyond that the scrolling gets strange sometimes, as happened in this case.

In browsers Webkit (Chrome and Safari) there are pseudo classes to style the bar. See here: Custom Scrollbars in Webkit

  • It should be noted that unless there is a good reason, increasing the content accommodation time is a BAD idea... It tires the eye, irritates the more agile users (not to mention the hasty ones...) and in general is an effort with a great chance to backfire.

Browser other questions tagged javascript css dom

You are not signed in. Login or sign up in order to post.