jQuery simplemodal 禁用滚动

Question

我在页面上滚动内容超过 2000 像素。

如果用户单击div，则会在简单模式窗口中弹出滚动内容。现在我的客户希望在模式窗口打开时使原始页面不可滚动。 (当然，模式应该仍然是可滚动的。)

这可能吗？

编辑:我已经尝试过你的建议。基本上是可以的，但是问题有点复杂:

$(".foReadMoreLink a").click(function(){
    if ($('#modalBox').length == 0)
    $('body').append('<div style="display:none" id="modalBox"></div>')
    $('body').css({'overflow':'hidden'});
    $.post('jquery/loadarticle.php',{id:$(this).attr('id')},function(data){
        $('#modalBox').html(data).modal({overlayClose:'true'});
    })
    return false;
});

我在链接上使用 return false，以便机器人和没有 JavaScript 的用户(是的，即 2%)可以打开文章。使用上面的代码，它可以按预期工作，但是在关闭模式后，我必须返回滚动条，但此代码将不起作用:

$(".foReadMoreLink a").click(function(){
    if ($('#modalBox').length == 0)
    $('body').append('<div style="display:none" id="modalBox"></div>')
    $('body').css({'overflow':'hidden'});
    $.post('jquery/loadarticle.php',{id:$(this).attr('id')},function(data){
        $('#modalBox').html(data).modal({onClose:function(){$('body').css({'overflow':'auto'})},overlayClose:'true'});
    })
    return false;
});

Answer 1

在脚本中打开模式:

$("html,body").css("overflow","hidden");

关闭时:

$("html,body").css("overflow","auto");

(需要 HTML 和正文，因为滚动条根据您所使用的浏览器附加到浏览器的不同部分)