Develop Reference

I want to scroll use only button on scrollify

I'm using a scroll animation through the "scrollify".
i want limit any scroll function.
i want to scroll only use button click scrolling, but not use touch scroll and mouse scroll.
if it's hard, expedient also good. Is there aother way?

I think touch events are currently not supported. But for the mousewheel you could do:
JQuery:
$('body').bind("mousewheel", function() {
return false;
});

Loop horizontal scrolling of two divs with mousewheel and buttons

I need to loop horizontal scrolling of wide block. Also I need to controll scrolling with mousewheel and buttons.
I have created working demo on codepen.
Demo on CodePen
Here I use Endless.JS for loop scrolling (works with 2 divs and more) and jquery.mousewheel for mouse wheel support. Also I write some code for arrows. On hover -> block start scrolling with animation.
animate({scrollLeft:'+=40'}
This method works great with mouse wheel but I got some trouble with arrows. After I have scrolled first few divs other div become blinking and works like artifact in game :) (see demo)
Can you help me? Maybe I need to use some other method or lib?
Thanks a lot.

You should probably avoid jQuery.animate here. Not exactly sure what causes the problem, but using timeouts seems to work fine. That way, you also have more control over the delay and animation speed. http://codepen.io/anon/pen/zGbLB
var timeout;
function loop_next(){
timeout = window.setTimeout(function() {
container.scrollLeft(container.scrollLeft() + 2);
loop_next();
}, 20);
}
function loop_prev(){
timeout = window.setTimeout(function() {
container.scrollLeft(container.scrollLeft() - 2);
loop_prev();
}, 20);
}
function stop(){
window.clearTimeout(timeout);
}

jQuery onScroll() show and hide DIVs

I have a simple onScroll function, which shows a DIV when the scroll (down) height is 100 for example, and then if scrolled up soon as it reach 100 it hides the div, works perfect.
However, if I scroll down quickly and while its showing the DIV if I quickly scroll up & down 2 three times, it doesn't catch the event, even if its up again, it still shows the DIV, but again if I scroll even 1 pixel down, it hides it and if reaches 100 then it shows DIV again.. I hope I made it clear, I dont have an online demo as I am working on localhost.. below is my function that I am using standalone in the template within just <*script> tag..
jQuery(document).scroll(function ($) {
var y = jQuery(this).scrollTop();
var hoffset = 100;
if (y > hoffset) {
// show div
} else {
// hide div
}
});
Can someone please guide me to right direction, what other best approaches can be done for this, basically I am doing this for header nav div..
regards

Do you want like this? See my Fiddle
I use fadeIn() and fadeOut() instead.

The only way I found to stop animation, while its in the process is below and works..
jQuery('.thedivclass').stop(false, true).slideDown();

Detect scrolling attempts in overflow:hidden page?

I want to detect when the user is trying to scroll up or down on my page, but since I don't want to allow the actual scrolling I have set an overflow:hidden body. The code is something like this:
$('html,body').css('overflow','hidden');
$(window).scroll(function(event){
console.log("scroll");
});
The problem is that since there is no actual scrolling I cannot fire the event, I have thought about removing the overflow style and somehow preventing scrolls but I cannot figure out how to do it.
Anyway is there a way to fix the scrolling while detecting scrolling attempts? Thanks

Try using jQuery mousewheel https://github.com/brandonaaron/jquery-mousewheel. You can detect the mousewheel movement. The other option is to not set the overflow to hidden but instead catch the scroll attempt and scroll them yourself. There are also a bunch of libraries for JS scrolling, I like http://manos.malihu.gr/jquery-custom-content-scroller/.

Here's a jQuery-solution.
$(document).bind('mousewheel', function(e) {
var delta = e.originalEvent.wheelDelta;
console.log('The mouse delta is : ' + delta);
});
jQuery Doc - .bind()

JQuery scroll on hover or mousedown

I have a gallery with thumbnails inside a container with overflow:hidden which I need to scroll. I already have it scrolling in steps on click, using .scrollLeft(). How to make it scroll smoothly on mouseover, or preferably on mousedown to the end of list? I'm looking for a way without plugins.
This is what I got for scroll on click.
$("#slider").scrollLeft($("#slider").scrollLeft() + 200);

do you mean something like:
$("#someEle").hover(function(){
$("#slider").scrollLeft($("#slider").scrollLeft() + 200);
},function(){
$("#slider").stop();
});