отслеживать скрол

@tgarl · Регистрация: 15.02.2012

Author24 — интернет-сервис помощи студентам

Javascript

var pag_e = 1;
var block_e = false;
$(window).scroll(function () {
    if($(window).height() + $(window).scrollTop() >= $(document).height() - 600 && !block_e) {
        block_e = true;
        pag_e = pag_e + 1;
                alert(pag_e);

вот никак не могу понять как заблокировать скрипт - если прокручивать потихоньку, то все работает, а если колесиком мышки, то получаю сразу pag_e=2, pag_e=3. иногда 2 одинаковых значения и у меня выскакивает либо 2 одинаковых сообщения либо 2 сразу

Добавлено через 21 час 29 минут
никто не может подсказать?

@Lazy_Den · 13.02.2014, 17:36

Сообщение от tgarl

никто не может подсказать?

Подсказать, что шаг колеса мышки отличается от того, когда юзер тянет за скроллбар? Или подсказать, что такой шаг у разных устройств, может значительно отличаться? Или предположить, что высота каждого блока настолько мала, что и одного движения колеса хватает, чтоб проскочить сразу несколько блоков? Еще вчера прошел мимо, потому как не охота быть К.О. Можно было бы что-то подумать, что-то предположить, найти правильный бубен, с которым плясать, но для этого, как минимум, хорошо бы выложить пример в песочницу. Для вас, как далеко не новичка на форуме, я думал, что это должно быть очевидно.

@tgarl · 13.02.2014, 18:57 **[ТС]**

если вы понимаете мою ошибку, то на мой взгляд того, что я выложил достаточно. Дальше было всего-лишь отобразить div с id=asd+pag_e Но если вам нужен весь код не вопрос, правда я уже его переделал под постраничку(проблема осталась) вот он http://jsfiddle.net/Dgtgt/

Javascript

$(document).ready(function () {
    var pag_e_f = $("#nav_resulsi").val();
    var pag_e = 1;
    var block_e = false;
    var stranno = $("#podgruzka_e").html();
    var ids_e = null;
$(window).scroll(function () {
    if($(window).height() + $(window).scrollTop() >= $(document).height() - 500 && !block_e) {
        block_e = true;
        if(ids_e == null){
            scrollPosition=$(window).scrollTop();
            ids_e = setTimeout(function(){
                pag_e = pag_e + 1;
                if ( pag_e <= pag_e_f){
                    $("#prelod").css('display','block');
                        //alert(pag_e+" - "+pag_e_f); сюда приходят 2значения вместо 1
                        $("#podgruzka_e").load('/ind.php #test li', {PAGEN_1: pag_e}); 
                        setTimeout(function(){
                            stranno = $("#podgruzka_e").html();
                            $('#test').append(stranno);
                            $("#prelod").css('display','none');
                            if (scrollPosition !== undefined && scrollPosition !== null) {
                                $(window).scrollTop(scrollPosition);
                            }
                        },2000);
                        $("#podgruzka_e").html();
                        if(ids_e !== null){ids_e = null;}
                        block_e = false;
                }
            },500);
        }
    }
});
 
});

HTML5

<ul id="test">
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
    <li>блок</li>
</ul>
<div id="prelod" style="display:none; text-align:center;width:99%;"><img src="/images/486.GIF"></div>
<input type="hidden" value="5" id="nav_resulsi">
<div id="podgruzka_e" style="display:none;"></div>

Комментарий модератора

Код должен присутствовать в тексте сообщения. Песочницы — это лишь бонус для демонстрации.

@Lazy_Den · 13.02.2014, 21:34

Мде... Видать это страшная тайна, раз вы не хотите ввести в курс дела. Глядя на ваш код, я могу только догадываться, что у вас там происходит и какой результат должен быть в итоге. Сделал вам абстрактный пример и поясню, что там происходит. Пригодиться - плиззз, а нет - то пардоньте.

Javascript

var flag = false,
    block = 1,
    cnt = $('#grid li').length,
    output = $('#output'),
    mousewheelevt = (/Firefox/i.test(navigator.userAgent)) ? "DOMMouseScroll" : "mousewheel";
 
output.load('/gh/gist/response.html/8977252 #b1');
$(document).on(mousewheelevt+'.my_wheel', function(e){
    e.preventDefault();
    console.log(flag);
    if(flag) return false;
    var evt = window.event || e;     
    evt = evt.originalEvent ? evt.originalEvent : evt;
    var delta = evt.detail ? evt.detail*(-40) : evt.wheelDelta; 
    if(delta > 0) {
        if(block <= 1) return false;
        output.load('/gh/gist/response.html/8977252 #b' + (--block));
    }
    else{
        if(block >= cnt) return false;
        output.load('/gh/gist/response.html/8977252 #b' + (++block));
    }
    flag = true;
    $('html,body').finish().animate({
        scrollTop : $('li').eq(block).offset().top
    }, 1000, function(){
        flag = false;
    });
});
// если надо отменить запрет скроллинга мышью
//$(document).off('.my_wheel');

Задачу придумал следующую: необходимо, чтоб при прокрутке мыши, попадать четко на очередной блок, при этом должен подгружаться соответствующий блок внешнего документа (его можно лицезреть тут).
Решение: запрещаем юзверю прокрутку мышкой, отлавливаем направление, куда он планировал скроллить и с помощью метода .animate() подводим к следующему (вверх/вниз) от текущего блоку. Может чего лишнего забыл убрать из кода, но это уже не суть важно.

Добавлено через 5 минут
P.S. К чему это я?.. Иногда лучше сделать работу за пользователя, чем ждать, что он может повести себя, как обезьяна с гранатой.

@tgarl · 14.02.2014, 10:51 **[ТС]**

Мде... Видать это страшная тайна, раз вы не хотите ввести в курс дела. Глядя на ваш код, я могу только догадываться, что у вас там происходит и какой результат должен быть в итоге.

никакой тайны нет. я привел код который использую. содержимое блоков <li> генерируется на основе request параметров. id=test не меняется, на странице ничего не меняется, только когда прокручиваем до грубо говоря 3/4 документа

Javascript

1	$(document).height() - 500

мы отправляемся на эту же страницу, но с параметрами

Javascript

1	$("#podgruzka_e").load('/ind.php #test li', {PAGEN_1: pag_e});

и забираем содержимое сгенерированного id=test и подставляем в текущий в конец - по сути это постраничная навигация через скрол. но проблема в том что когда я скролю(и тут не важно через мышку или ползунок...) скрол срабатывает 2 раза и я получаю либо две вторых, либо две третьих страницы

Javascript

1 2	if($(window).height() + $(window).scrollTop() >= $(document).height() - 500 && !block_e) { block_e = true;

этот блок в моем понятии должен сработать 1 раз, а второй нет потому как block_e уже существует, но на практике получается что нет.
как еще объяснить то, что мне нужно

За приведенный код большое спасибо, есть чему поучиться, но вот ирония ваша мне увы не понятна

@Lazy_Den · 14.02.2014, 11:13

Сообщение от tgarl

ирония ваша мне увы не понятна

Не понятна потому, что это вовсе не ирония, а скорее плохо скрытое раздражение. Но оставим это, а по поводу вашей задачи, то скролл будет срабатывать постоянно, а вот остановите вы выполнение действий, связанных с этим событием или разрешите выполнение - зависит от вас. То есть, доскроллили до 2/3 страницы > выполнили действие > поставили флаг > скроллим дальше > проверяем по флагу, делали мы что-то или еще нет > если да - return false, если нет - выполняем и ставим флаг.

@Lazy_Den 3325 / 2845 / 1423 Регистрация: 15.01.2014 Сообщений: 6,170
	13.02.2014, 17:36	2
	Сообщение от tgarl никто не может подсказать? Подсказать, что шаг колеса мышки отличается от того, когда юзер тянет за скроллбар? Или подсказать, что такой шаг у разных устройств, может значительно отличаться? Или предположить, что высота каждого блока настолько мала, что и одного движения колеса хватает, чтоб проскочить сразу несколько блоков? Еще вчера прошел мимо, потому как не охота быть К.О. Можно было бы что-то подумать, что-то предположить, найти правильный бубен, с которым плясать, но для этого, как минимум, хорошо бы выложить пример в песочницу. Для вас, как далеко не новичка на форуме, я думал, что это должно быть очевидно. 0

@Lazy_Den 3325 / 2845 / 1423 Регистрация: 15.01.2014 Сообщений: 6,170
	14.02.2014, 11:13	6
	Сообщение от tgarl ирония ваша мне увы не понятна Не понятна потому, что это вовсе не ирония, а скорее плохо скрытое раздражение. Но оставим это, а по поводу вашей задачи, то скролл будет срабатывать постоянно, а вот остановите вы выполнение действий, связанных с этим событием или разрешите выполнение - зависит от вас. То есть, доскроллили до 2/3 страницы > выполнили действие > поставили флаг > скроллим дальше > проверяем по флагу, делали мы что-то или еще нет > если да - return false, если нет - выполняем и ставим флаг. 0