Question

我已经制作了一个自定义幻灯片菜单，让我有点悲伤。 Click here for example当您单击菜单按钮时，幻灯片菜单会将背景图像向右推，并留下多余的x滚动。

此功能的目标是让滑动菜单位于背景图像的顶部。目前，我的背景图片是<img>标记，并且absolute位于客户希望手动更新图片的位置。这可能是这个问题发生的主要原因。此外，div id="right"正在包装所有内容，包括背景图像。我试图放置我包装内容的地方但是我无法找出使这项工作正常的方法我想知道是否有办法解决这个问题下面是一段代码，包括javascript和HTML结构

$('#button').toggle( 
function() {
    $('#right').animate({ left: 400 }, 'slow', function() {
        $('#button').html('Close');
    });
}, 
function() {
    $('#right').animate({ left: 0 }, 'slow', function() {
        $('#button').html('Menu');
    });
}

）;

<div id="right">
    <div id="menubar">
        <div id="button">
            Menu
        </div>
    </div>

<div id="menu">
    <ul>
        <li><a href="#">Menu Item 1</a></li>
        <li><a href="#">Menu Item 2</a></li>
        <li><a href="#">Menu Item 3</a></li>
        <li><a href="#">Menu Item 4</a></li>
        <li><a href="#">Menu Item 5</a></li>
        <li><a href="#">Menu Item 6</a></li>
        <li><a href="#">Menu Item 7</a></li>
        <li><a href="#">Menu Item 8</a></li>
        <li><a href="#">Menu Item 9</a></li>
        <li><a href="#">Menu Item 10</a></li>
        <li><a href="#">Menu Item 11</a></li>
        <li><a href="#">Menu Item 12</a></li>
    </ul>
</div>

有人可以告诉我一个可以解决这个问题的方法吗？

Answer 1

Simpy补充说：

Body{
    overflow-x:hidden;
}

所以隐藏正文 -s水平滚动。

有关owerflow的更多信息。

Jquery幻灯片菜单x滚动问题

1 个答案: