jPanelMenu 在 IE 中无法正常工作（所有版本）

Question

我在我的一个网站上使用 jPanelMenu jQuery 插件。我注意到 IE（所有版本）中存在问题。

当菜单被触发时，它会按预期滑入。单击菜单项后，页面将滚动到所需部分并再次关闭。菜单关闭时，网站右侧会出现多余的边距。再次打开菜单时，它的大小是原来的一半，并再次缩小了内容的间隙。

这是一个小提琴： http://jsfiddle.net/huzLU/1/

以及在 IE 中显示问题的三个屏幕截图：

• http://i.stack.imgur.com/FKask.jpg
• http://i.stack.imgur.com/ItIBa.jpg
• http://i.stack.imgur.com/99s9S.jpg

这是我用于菜单的代码：

<script>
$(document).on('touchend',jP.panel,function(e){
e.preventDefault();
if ( jP.menuIsOpen() ) jP.closeMenu(jP.options.animated);
});

$(document).on('click',jP.panel,function(e){
e.preventDefault();
if ( jP.menuIsOpen() ) jP.closeMenu(jP.options.animated);
});
</script>

<script>
$(document).ready(function(){
var jPM = $.jPanelMenu({
closeOnContentClick: false
});
jPM.on();

$('a[href^="#"]').on('click',function (e) {
e.preventDefault();

var target = this.hash,
$target = $(target);

$('html, body').stop().animate({
'scrollTop': $target.offset().top-50
}, 900, 'swing', function () {
window.location.hash = target;
});
setTimeout(function() {
jPM.close(true);
}, 900, 'swing');
});

});
</script>

还有；这是网站的链接：www.didson.nl

希望有人能帮帮我，在此先感谢！

Answer 1

编辑：试试这个新的Fiddle。 我修复了 setTimeout 调用以关闭。 （实际上，您根本不需要设置超时）

问候

问题与样式有关。它将类“.jPanelMenu-panel”的div设置为“位置：相对；”这导致了一些问题。

在这个Fiddle 中，您可以看到如何通过将位置设置为绝对来解决问题。当然，过渡看起来很糟糕，但我让你自己决定。

您的版本的 HTML：

<div class="jPanelMenu-panel" style="position: relative; left: 0px;">

我添加的那一行：

    $(".jPanelMenu-panel").css('position', 'absolute');

希望对你有帮助！