Question

我有一個簡單的模態彈出窗口。當關閉時返回到頁面的頂部。我希望它保持在同一個滾動位置。這是可能的，即時通訊不是很棒。

這裏是頁：http://pagedev.co.uk/hoppings/product/2-4m-beads

這裏是我的javascript：

$(function(){ 

var appendthis = ("<div class='modal-overlay js-modal-close'></div>"); 

    $('a[data-modal-id]').click(function(e) { 
    e.preventDefault(); 
    $("body").append(appendthis); 
    $(".modal-overlay").fadeTo(1000, 1); 
    //$(".js-modalbox").fadeIn(500); 
    var modalBox = $(this).attr('data-modal-id'); 
    $('#'+modalBox).fadeIn($(this).data()); 
    }); 


$(".js-modal-close, .modal-overlay").click(function() { 
    $(".modal-box, .modal-overlay").fadeOut(500, function() { 
    $(".modal-overlay").remove(); 
    }); 
}); 

$(window).resize(function() { 
    $(".modal-box").css({ 
    top: ($(window).height() - $(".modal-box").outerHeight())/2, 
    left: ($(window).width() - $(".modal-box").outerWidth())/2 
    }); 
}); 

$(window).resize(); 

}); 

Answer 1

您需要防止的緊密聯繫的默認操作爲你打開鏈接：

$(".js-modal-close, .modal-overlay").click(function(e) { 
    e.preventDefault(); 
    $(".modal-box, .modal-overlay").fadeOut(500, function() { 
    $(".modal-overlay").remove(); 
    }); 
}); 

Answer 2

因爲您使用而發生這種情況href='#'

<a class="js-open-modal" href="#" data-modal-id="12" onclick="ga('send', 'event', 'PDF Download', 'Link Click', 'Q-Line 2.4m D Mould');"><div class="product-hover"></div></a> 

可以防止在JavaScript

$(".js-modal-close, .modal-overlay").click(function(e) { 
    e.preventDefault(); 
    $(".modal-box, .modal-overlay").fadeOut(500, function() { 
     $(".modal-overlay").remove(); 
    }); 
}