The solution to jQuery niceScroll's scroll bar dislocation problem is jquerynicescroll.

Source: Internet
Author: User

The solution to jQuery niceScroll's scroll bar dislocation problem is jquerynicescroll.

Although the niceScroll plug-in is very easy to use, after all, it does not rely on css, but simply js can set a nice scroll bar.

NiceScroll was recently used in the project, and there is a horizontal scroll bar in the table. It is easy to misposition the vertical scroll bar, that is, the scroll bar will be suspended in the left blank, not at the bottom or right of the div, open f12 and you can see that the scroll bar is not directly located in the div, but at the end of the entire body, at the same level as the div to be located. This leads to this bug, especially in IE, the scroll bar is everywhere )︿.

I found a lot of information on the Internet and it seems that this is not the case. Maybe their projects do not have so many horizontal scroll bars .....

To solve this bug, we thought of setting the scroll bar in the div so that it would not be suspended. After multiple tests, it is found that the div to be set is located.Position: absoluteIn this way, the scroll bar will be nested in it and there will be no disorderly floating dislocation.

When no position is found, the scroll bar is at the end of the body,

The positioned scroll bar is inside the div,

I am using the wex5 grid table. In the grid row, add the class name gridPositon to set it to absolute positioning, and then set it to relative positioning at its parent level, "sub-parent ". This operation solves the problem of the scroll bar floating dislocation, but there is a new bug in IE, that is, the mouse hover and

Click "no color" (--"ie") When selected, and then set the div with more than two layers. This solves the problem of no color in ie. The final structure is as follows:

Summary:As long as the div used is absolutely positioned, the scroll bar is nested in it. There is no color in ie because it is directly located at its parent level, so I changed it to relative location in the outermost window, so that we don't have to bother modifying its structure.

The solution to the above jQuery niceScroll scroll bar dislocation problem is all the content shared by the editor. I hope to give you a reference, and hope you can provide more support to the customer's house.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.