Javascript / jQuery scrollTop проблема

Question

Я заново создал простую версию того, что я пытаюсь сделать здесь (jsFiddle)

Заголовок должен оставаться там, где он есть, и при прокрутке вниз, когда вы щелкаете по заголовку div, он должен прокручиваться вверх до самого верха, что и происходит. Но если вы сосредоточитесь на вводе или нажмете «логотип», свиток должен остаться там, где он есть.

Первый метод, который я попробовал, - это использование .css в jQuery и установка z-index для ввода / логотипа выше заголовка, затем получение текущего прокрутки и сохранение его в этом положении.

Этот тип работает, но как только вы нажмете на ввод или логотип, прокрутка заголовка больше не будет работать.

Я также попытался изменить логотип / input jQuery на .animate с медленной скоростью, и он остается статичным в течение пары секунд, а затем прокручивается наверх, даже если я этого не делал. Вот второй пример - jsFiddle

Выполнение этого во втором примере, однако, не останавливает работу другой функции.

Есть ли какая-то причина, по которой я скучаю по этому поведению?

Answer 1

Вы можете предотвратить распространение события click в заголовок.

$("#logo, #input").click(function(e) {
    e.stopPropagation();
});

Answer 2

Проверьте эту интересную статью о порядке событий, все, что вам нужно сделать, это остановить распространение.Вот ваш модифицированный Скрипка

$("#logo, #input").click(function(e) {
    e.stopPropagation();
    var y = window.scrollY;

    $('html').animate({
        scrollTop: y
    }, 'slow');
    $('body').animate({
        scrollTop: y
    }, 'slow');
});

Answer 3

Все, что вам нужно сделать, это остановить распространение событий. Для этого вы возвращаете false из функции щелчка.

$("#logo, #input").click(function() {
    return false;  // Add this line
});

Вот ваша обновленная скрипка: http://jsfiddle.net/BRnvT/