offscreen jquery元素导致水平滚动

Question

我有一个元素离屏，点击屏幕上。问题在于它实际上不在屏幕外，它正在水平扩展我的文档，所以我在页面底部获得了一个滚动条。

这里的网站：http://ericbrockmanwebsites.com/dev4/

这里的HTML：

<div id="container-fluid"> 
    <div class="row-fluid"> 
     <div class="span12"> 
      <div id="dashboard"> 
       <nav id="access"> 
        <div class="open"></div><?php wp_nav_menu(array('theme_location' => 'header-menu')); ?> 
       </nav> 
      </div> <!-- dashboard --> 
     </div> <!-- span12 --> 
    </div> <!-- row-fluid --> 

这里的CSS：

#container-fluid { 
    width:1280px; 
} 

.row-fluid .span12 { 
    width: 100%; 
    *width: 99.94680851063829%; 
} 

#dashboard { 
    font-size:30px; 
    float:left; 
    position: absolute; 
    right: -659px; 
    z-index: 100; 
} 

#access { 
    display: block; 
    float: right; 
    margin: 10px auto 0; 
    width:730px; 
} 

.open { 
    background: #cabd32 url(images/open.png) top left no-repeat; 
    background-position:center; 
    float:left; 
    padding: 32px 35px 33px; 
} 

.close { 
    background: #cabd32 url(images/close.png) top left no-repeat; 
    background-position:center; 
    float:left; 
    padding: 32px 35px 33px; 
} 

而这里的脚本：（由@AlexCheuk书面）

$('.open').bind('click',function(){ 
    $('#dashboard').stop().animate(
    { 
     right: $(this).hasClass('close') ? '-659px' : '0' 
    }); 
    $(this).toggleClass('close'); 
}); 

任何帮助，非常感谢。

Answer 1

最简单的似乎是：

添加body {overflow:hidden;}或可能使用overflow-x

Answer 2

尝试添加这对你的CSS

body{ 
    overflow:hidden; 
    .... 
} 

Answer 3

身体CSS

，加

overflow:hidden