CODEWITHSUNDEEP
javascripttriggersscrollmousewheel
Dygestor
Dygestor

Reputation: 1259

Trying to trigger scroll event by using jquery.mousewheel

I'm having some trouble with triggering a scroll event by using jquery.mousewheel. I want to "expand" the scroll event for #bio-content-container to trigger when scrolling over #bio-slider-container. I'm using following code: 

var lastScrollTop = 0;      
$("#bio-content-container").scroll(function () {
    var st = $(this).scrollTop();
    if (st > lastScrollTop){
        scroll('Down');
    } else {
        scroll('Up');
    }
    lastScrollTop = st;
});

jQuery(function($) {
    $('#bio-slider-container')
        .bind('mousewheel', function(event, delta) {
            $("#bio-content-container").trigger('scroll');
            return false;
    });
});

I don't want to trigger scroll on #bio-slider-container, so that's why I'm using mousewheel. Any help would be much appreciated :)

Upvotes: 4

Views: 11834

Answers (1)

Slippery Pete
Slippery Pete

Reputation: 3110

If I understand correctly, you want to scroll the contents of #bio-content-container when you use the mousewheel over #bio-slider-container. You might want to check out the jquery.scrollTo plugin. This code works for me (without seeing your HTML):

$(document).ready(function () {

    $('#bio-slider-container').bind('mousewheel', function (event, delta) {
        var content = $("#bio-content-container");
        if (delta < 0) {
            content.scrollTo("+=10");
        } else {
            content.scrollTo("-=10");
        }
    });

});

Upvotes: 3

Related Questions