страница прыгает вверх при нажатии на большой палец изображений

Question

Я ползунок изображения,

<div class="slider"> 
    <div id="image_large_1"> 
     <img src="../1.png" alt=""> 
    </div> 
    <div id="image_large_2"> 
     <img src="../2.png" alt=""> 
    </div> 
</div> 

<!-- Slider close,thumb start --> 

<div class="thumbs_div"> 
    <div id="thumb_1"> 
    <img src="../1_t.png" alt="" id="thumb_1"> 
    </div> 
    <div id="thumb_2"> 
    <img src="../2_t.png" alt="" id="thumb_2"> 
    </div> 
</div> 

Когда пользователь нажимает на палец изображения, то соответствующий ему большой размер изображения будет отображаться в слайдера DIV. Все работает нормально, но когда я нажимаю на изображение большого пальца, то страница прыгает вверх, что может быть проблемой? Ниже приведен код jQuery.

$("div[id^=image_large_]:gt(0)").hide(); 
$("div.thumb_div img").click(function(){ 

     div_id = $(this).attr('id').substring('thumb_'.length); 
     $("div[id^=image_large_]").hide(); 
     $("div#image_large_"+div_id).fadeIn('slow'); 

    }); 

Answer 1

Если slider ДИВ не уточнили размеры, то она разрушается, когда image_large_* дивы скрыты этой линии:

$("div[id^=image_large_]").hide(); 

в результате чего содержание ниже вниз страницы будет двигаться вверх воли прыгать вверх, когда .hide() завершается.

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