Javascript 为垂直滚动而不是水平滚动将项目固定到位_Javascript_Html_Css

Javascript 为垂直滚动而不是水平滚动将项目固定到位

javascript html css

Javascript 为垂直滚动而不是水平滚动将项目固定到位,javascript,html,css,Javascript,Html,Css,我有一个菜单，它包含在一个带有类float的div中。浮点数如下： .float { display:block; position:fixed; top: 20px; left: 0px; z-index: 1999999999; } * html .float {position:absolute;} 上面的css类使菜单保持不变，无论用户如何滚动internet explorer的*html。但是，我需要使它只在用户垂直滚动时保持在原位。如果用户向左或向右滚动，它应该从左向右移动。我

我有一个菜单，它包含在一个带有类float的div中。浮点数如下：

.float {
display:block; 
position:fixed; 
top: 20px;
left: 0px;
z-index: 1999999999;
}
* html .float {position:absolute;}

上面的css类使菜单保持不变，无论用户如何滚动internet explorer的*html。但是，我需要使它只在用户垂直滚动时保持在原位。如果用户向左或向右滚动，它应该从左向右移动。我似乎找不到任何css来支持这一点，而且我遇到的任何javascript在调整项目时都是不稳定的。下面的javascript可以工作，但如果可能的话，我希望它更平滑一些。我将body标签设置为onload=scrolladj，scrolladj写在下面：

function scrolladj()
{

    if(brow == 'Microsoft Internet Explorer')
    {

        o = document.documentElement.scrollLeft;

    }
    else
    {

        o = window.pageXOffset;

    }

    $('main_menu').style.left = (20-o)+'px';


}

有什么想法吗？

以下代码适用于FF和Chrome

<HTML>
 <HEAD>
    <style>
        .float {
    display:block; 
    position:fixed; 
    top: 20px;
    left: 0px;
    z-index: 1999999999;
    }


    </style>
  <script>
    function x()
    {
        if(document.body.offsetLeft != document.body.scrollLeft)
            document.getElementById('fd').style.position='absolute';
        else
            document.getElementById('fd').style.position='fixed';
    }
  </script>
 </HEAD>

 <BODY onscroll="x();">
    <div class="float" id="fd">
        sdkjfkljfs
    </div>
  <div style="overflow: auto; width: 2000px; height: 1000px" >
  </div>
 </BODY>
</HTML>

我认为这种行为远远超出了当前CSS的范围。不过，它可能可以通过JavaScript实现。是的，这将成为一个真正的问题：/我很惊讶浏览器到底有多么不发达。希望有人有办法做到这一点。为什么在页面上有水平滚动？你是指浏览器窗口宽度小于网页宽度的情况吗？是的。我创建了一个适合1024x768屏幕的网站，我的大多数目标用户使用的分辨率都比这个高。但是，我想为那些可能会减小浏览器窗口大小、降低分辨率等的问题做好准备。