javascript - 调用 JavaScript Action 时修改样式 - prettyPhoto lightbox

当下面的 javascript Action 被调用时 (prettyPhoto lightbox)，我需要修改 body 的样式来使 overflow:hidden 和 position:fixed。

<script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
    $("a[rel^='prettyPhoto']") .prettyPhoto({
    });
  });
</script>

因此，我需要插入如下内容:

$('body').css('overflow','hidden');
$('body').css('position','fixed');

...但仅当灯箱打开时。

基本上，我需要在 prettyPhoto 处于事件状态时停止主体滚动。有什么想法吗？

最佳答案

尝试将一些基本的 JavaScript 代码放入打开 prettyPhoto 的函数中。像这样:

document.getElementById(BodyId).setAttribute("class","body_noscrolling");

并为禁用滚动的正文 (.body) 创建一个 css 值:

.body {
}  
.body_noscrolling {
overflow: hidden;
position: fixed;
}

同时更改 <body>标签:

<body id="BodyId" class="body">

如果您的“prettyPhoto”中有一个 >CLOSE< 按钮，请将其添加到该按钮的代码中:

document.getElementById(BodyId).setAttribute("class","body");

我不确定它是否有效，因为我不知道你的 prettyPhoto 函数是如何调用的。

关于javascript - 调用 JavaScript Action 时修改样式 - prettyPhoto lightbox，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22693503/