Develop Reference

Prevent body scrolling when a fixed div is scrolled?

I've got a fixed slide menu that appears only on mobiles , the problem I got is , when I touch scroll down the menu, all the body elements scrolls down too,I want to prevent body scrolling when touch scrolling the nav element, I tried many js codes but nothing, Help please.
PS: The Menu I want to scroll is inside the body, I dont want to prevent it from scrolling too

First thing would be make the menu big enough that it needs to be scrolled, so, let's say your menu wrapper has a height of 200px. The inner content should have more than 200px, at least.
After that you can add overflow-y: scroll; to your menu wrapper CSS selector.
If you face problems, http://iscrolljs.com should help you with that!

How to move a div's scrollers to the browser?

I have a div with with the following css:
.long-table-container {
overflow-x: auto;
}
Instead of attaching scrollbars to .long-table-container, I would like to instead use the browser's scrollbars to do the job. Is this possible?
The reason I need to do this is because I have a long table in .long-table-container and the only way to scroll left and right is by scrolling all the way to the bottom of the page and then moving horizontal scroller of .long-table-container which is a pain for any user.
Fiddle: http://jsfiddle.net/ox5qzp1x/

You can create additional scrollable element with fixed position at bottom of the page and connect these two elements, like in question Attach Horizontal Scrollbar to bottom of window if scrollable div is taller than window

Smooth scroll div horizontally by a pixel amount, no scrollbars

I've got 10 floating DIVs in a container DIV that I want to be able to scroll through using a button.
I'd like to use left/right buttons to make the container DIV scroll 300px horizontally to display the next floating DIV.
I'd like the width of the container to appear as 100% of the window, and I'd also like there to be no horizontal scroll-bar on the bottom. If it could scroll sideways that'd be great but it's not a must have.
Here's what I've got:
http://jsfiddle.net/696je/
I'm just looking for a function and the way to activate the function for left/right buttons.
I've tried Google for hours, I've tried Flesler's ScrollTo but I haven't had any luck, it might be something do to with the way I've got the width set up, anyway, thanks for your help.

It is possible to do with mix of CSS (display:inline-block and white-space:nowrap) and jQuery (scrollLeft)
here is a jsFiddle implementation with minimum possible wrappers.

I was a little confused by your code you posted in the jsFiddle. You said you wanted no horizontal scroll bars, yet your stuff was set up that way. I went with the horizontal scroll bar since that is what you were going with in your code.
I made a working function here jsFiddle. To get it to work in the frame you need to put focus in the "Result" window (just click anywhere), then use your left and right arrows.
I must give the javascript for keypress credit from this post

HTML div overflow horizontal scroll at the top of div without jquery

Is it possible to show horizontal scroll bar of div at top of div via javascript or CSS without jquery. By default it comes at bottom.
I goggled for it but did not got any help.

Try this Fiddle, it has scroll bars in top, This is based on How can I get horizontal scrollbars at top and bottom of a div?

Div Overflow, Scroll only work there, till div is removed and trigger a offset of that overflow offsetheight div

I have a Div Overflow prepended to the body container wrapper, when its triggered this prepend, I wish all the scroll made by the mouse scroll work only in the div overflow which has width: 60% of the window. so I wish anywhere I scroll only work in the div overflow, because the way that it is right now, when you reach the maximum scroll in the div, it starts to scroll the body in the background and also if I put my mouse outside of the div overflow it also scrolls the body in the background. what do I do to help this? I'm using JQuery library.
Another thing is that I would like to add an eventListener when the scroll of that div reach some height, it does something, call a javascript function for example.
Is it all possible? if Yes, how? Thank you guys in advance.

Try adding overflow:hidden to body. The browser will automatically add scroll if its content reachees beyond its boundaries.