Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/431.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 显示引导模式弹出窗口时导航菜单向右移动_Javascript_Html_Css_Twitter Bootstrap_Nav - Fatal编程技术网

Javascript 显示引导模式弹出窗口时导航菜单向右移动

Javascript 显示引导模式弹出窗口时导航菜单向右移动,javascript,html,css,twitter-bootstrap,nav,Javascript,Html,Css,Twitter Bootstrap,Nav,当modal弹出时,右滚动消失,主内容不移动-因此这很好,但导航菜单向右移动,填充滚动空间。 然后,当我关闭时,弹出的滚动条出现,菜单向后移动。 有没有办法防止菜单移动? 使用Bootstrap v3.3.1 我的菜单就是这样的: 这是否意味着它是引导中的一个bug 更新2 上述行为适用于所有最新的基于WebKit的浏览器,但只检查了IE 12,当modal出现时,整个页面向右移动。可能确实是一个bug,请尝试使用更新版本的Bootstrap。是的,这是Bootstrap中的一个开放bug。

当modal弹出时,右滚动消失,主内容不移动-因此这很好,但导航菜单向右移动,填充滚动空间。 然后,当我关闭时,弹出的滚动条出现,菜单向后移动。 有没有办法防止菜单移动? 使用Bootstrap v3.3.1

我的菜单就是这样的:

这是否意味着它是引导中的一个bug

更新2
上述行为适用于所有最新的基于WebKit的浏览器,但只检查了IE 12,当modal出现时,整个页面向右移动。

可能确实是一个bug,请尝试使用更新版本的Bootstrap。是的,这是Bootstrap中的一个开放bug。
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="/" id="navbar-brand">MySite</a>                
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
            <li class="home">
                <a href="/" class="btn_main"><i class="fa fa-home" title="home"></i></a>
            </li>               
            <li><a href="/contact">About</a></li>
        </ul>
            <ul class="nav navbar-nav navbar-right">

        <li><a href="/account/login" id="loginLink">Login</a></li>
    </ul>

    </div>

</div>
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
            <h4 class="modal-title" id="exampleModalLabel">Title</h4>
        </div>
        <div class="modal-body">
            <form name="form-contact" id="form-contact" class="form-validation">

                <div class="form-group">                        
                    <input type="email" class="form-control" placeholder="Enter your email" ng-model="contact.email" required="">
                </div>
                <div class="form-group hide">
                    <textarea class="form-control" rows="6" placeholder="Type your message"></textarea>
                </div>
                <input type="submit" id="submit-form" class="hidden">
            </form>                                
        </div>
        <div class="modal-footer">

            <label for="submit-form" class="btn btn-warning font-bold">Click!</label>
        </div>
    </div>
</div>
.modal-open .navbar-fixed-top,
.modal-open .navbar-fixed-bottom {
padding-right: 17px;
}