JQuery анимация делает страницу наверху

Question

Я нашел немного скрипта, чтобы сделать div loginform сползать с края спины и вернуться на разные клики от loginshow и loginhide. Также немного скрипта сделать topbar (содержащий кнопку «показать») и loginform прокрутить вниз, когда я прокручу страницу вниз.

Мое намерение заключается в том, чтобы быть скрытым и отображаться из любого места, поэтому вам не нужно прокручивать верхнюю часть страницы, чтобы получить доступ к полям/элементам этого div.

Однако всякий раз, когда я нажимаю loginshow или loginhide, страница перескакивает назад, когда анимация loginform запускается.

Это сценарий

var main = function() { 
$('#loginshow').click(function(){ 
    $('#topbar').animate({ 
     left: '245px' 
    }, 200); 
    $('#loginform').delay(100).animate({ 
     left: '0px' 
    }, 200);  
    $('#loginhide').delay(200).animate({ 
     left: '0px' 
    }, 100); 
}); 
$('#loginhide').click(function(){ 
    $('#loginhide').animate({ 
     left: '-80px' 
    }, 200) 
    $('#loginform').delay(200).animate({ 
     left: '-240px' 
    }, 200) 
    $('#topbar').delay(300).animate({ 
     left: '5px' 
    }, 200); 
}) 
$(window).on('scroll', function() { 
    var scrollPos = $(document).scrollTop(); 
    $('#loginform').css({ 
     top: scrollPos 
    }); 
    $('#topbar').css({ 
     top: scrollPos 
    }); 
}).scroll(); 
}; 
$(document).ready(main); 

Как я могу остановить loginshow и loginhide функции делают прыжок страницу обратно вверх? Спасибо за любую помощь, я только что начал с javascript вчера.

Answer 1

Вы пытались использовать jQuery preventDefault()?

$('#loginshow').click(function(event){ 
     event.preventDefault(); 
// Your code here 
    });