Функция привязки jQuery к нескольким событиям

Question

Функция привязки jQuery к нескольким событиям

0

У меня есть функция jQuery, которая добавляет новую область меню, если страница прокручивается мимо X пикселей. Все хорошо. Если страница обновляется после значения пикселя, функция не запускается. Я попытался добавить (привязать) дополнительное событие к обработчику функции, но без радости. У меня есть желаемый эффект работы, но прибегают к дополнительному коду:

$(window).load(function()
{
var num = 130; //number of pixels before modifying styles

console.log($(window).scrollTop());

// i have tried load, ready. what can I do???
$(window).bind('load scroll', function() 
{
    if ($(window).scrollTop() > num) 
    {
        $('.now_page').addClass('fixed');
        $('.now_page_res').fadeOut(0);
        $('.now_page_overlay').fadeIn(500).css("display","block").css("visibility","visible");          
    } 
    else 
    {
        $('.now_page').removeClass('fixed');
        $('.now_page_overlay').fadeOut(100).css("display","none").css("visibility","hidden");
        $('.now_page_res').fadeIn(500);
        //$('#cart_container').fadeIn(500);
    }
});

// EXTRA CODE HERE.... FFS there must be a way to bind the function above to page load...
{
if ($(window).scrollTop() > num)                        
    $('.now_page').addClass('fixed');
    $('.now_page_res').fadeOut(100);
    $('.now_page_overlay').fadeIn(500).css("display","block").css("visibility","visible");          
}
});

Любые предложения по тому, что я могу сделать, чтобы заставить это работать без дополнительного кода?

Nick 29 нояб. 2013, в 18:54

Источник

Теги:

jquery

bind

2 ответа

1

Запуск события прокрутки в окне вручную:

$(function () {
    var num = 130,
        $nowPage = $('.now_page'),
        $nowPageOverlay = $('.now_page_overlay'),
        $nowPageRes = $('.now_page_res');

    $(window).bind('scroll', function () {
        if ($(window).scrollTop() > num) {
            $nowPage.addClass('fixed');
            $nowPageRes.fadeOut(0);
            $nowPageOverlay.fadeIn(500).css("display", "block").css("visibility", "visible");
        } else {
            $nowPage.removeClass('fixed');
            $nowPageOverlay.fadeOut(100).css("display", "none").css("visibility", "hidden");
            $nowPageRes.fadeIn(500);
        }
    });

    $(window).trigger('scroll');
});

bagonyi 29 нояб. 2013, в 16:06

Ещё вопросы

adeneo · Accepted Answer · 2013-11-29T15-06-00.000Z

Это уже внутри window.onload, поэтому просто запускайте событие прокрутки:

$(window).on('load', function () {
    var num = 130;

    $(window).on('scroll', function () {
        if ($(window).scrollTop() > num) {
            $('.now_page').addClass('fixed');
            $('.now_page_res').fadeOut(0);
            $('.now_page_overlay').fadeIn(500).css("display", "block").css("visibility", "visible");
        } else {
            $('.now_page').removeClass('fixed');
            $('.now_page_overlay').fadeOut(100).css("display", "none").css("visibility", "hidden");
            $('.now_page_res').fadeIn(500);
        }
    }).trigger('scroll'); // triggers the above function on window.onload
});

Brilliant! Я должен был изменить привязку на (прокрутка, как предложено. Намного лучше!