Javascript 使固定div不水平滚动？

我有一个导航条，我正试图使之粘。它一直工作，直到用户在较小的屏幕尺寸上水平滚动，然后导航栏随之滚动，而页面保持在其位置（其设置为

绝对

），我需要它垂直固定，也就是说，但绝对水平。或者有其他方法来实现这一点/有解决办法吗

**CSS和CSS**

.wrapper{
最小宽度：900px；
}
.标题{
高度：0px；
宽度：604px；
右边距：自动；
左边距：自动；
位置：相对位置；
-webkit转换：转换0.5s到0.0s；
-moz转换：转换0.5s到0.0s；
-ms转换：转换0.5s到0.0s；
-o-转换：转换0.5s到0.0s；
转换：转换0.5s到0.0s；
}
/*第1页*/
.wrapper.contentpagewrapper1{
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：相对位置；
z指数：6；
不透明度：1；
显示：块；
顶部：-10px；
}
.wrapper.contentpage1{
背景图像：url（../images/Page%20no%20shadow2.jpg）；
背景重复：重复；
背景位置：中心；
盒影：0px 0px 50px 1px#000000；
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：绝对位置；
顶部：70像素；
}
.wrapper.contentpage1 h1{
字体系列：“Lusitana”，衬线；
颜色：#666；
左侧填充：15px；
填充顶部：10px；
}
.wrapper.contentPage1p{
字体系列：“Lusitana”，衬线；
颜色：#999；
右侧填充：15px；
垫底：15px；
左侧填充：15px；
}
/*第2页*/
.wrapper.ContentPageWapper2{
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：相对位置；
z指数：6；
不透明度：1；
显示：无；
顶部：-10px；
}
.wrapper.contentpage2{
背景图像：url（../images/Page%20no%20shadow2.jpg）；
背景重复：重复；
背景位置：中心；
盒影：0px 0px 50px 1px#000000；
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：绝对位置；
顶部：70像素；
}
.wrapper.contentpage2 h1{
字体系列：“Lusitana”，衬线；
颜色：#666；
左侧填充：15px；
填充顶部：10px；
}
.wrapper.contentPage2p{
字体系列：“Lusitana”，衬线；
颜色：#999；
右侧填充：15px；
垫底：15px；
左侧填充：15px；
}
/*第3页*/
.wrapper.ContentPageWapper3{
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：相对位置；
z指数：6；
不透明度：1；
显示：无；
顶部：-10px；
}
.wrapper.contentpage3{
背景图像：url（../images/Page%20no%20shadow2.jpg）；
背景重复：重复；
背景位置：中心；
盒影：0px 0px 50px 1px#000000；
高度：自动；
宽度：650px；
右边距：自动；
左边距：自动；
位置：绝对位置；
顶部：70像素；
}
.wrapper.contentpage3 h1{
字体系列：“Lusitana”，衬线；
颜色：#666；
左侧填充：15px；
填充顶部：10px；
}
.wrapper.contentpage3p{
字体系列：“Lusitana”，衬线；
颜色：#999；
右侧填充：15px；
垫底：15px；
左侧填充：15px；
}
.标题：悬停{
转换：标度（1.05）；
光标：指针；
}
navbar先生{
高度：0px；
宽度：400px；
右边距：自动；
左边距：自动；
z指数：5；
位置：相对位置；
顶部：200px；
}
纳瓦尔先生{
列表样式类型：无；
保证金：0；
填充：0；
}
纳瓦尔先生{
显示：块；
宽度：400px；
高度：79px；
文本对齐：居中；
填充顶部：20px；
背景图像：url（../images/Menu%20Button2.png）；
文字装饰：无；
颜色：#FFF；
文本阴影：1px 1px 5px#000000；
背景位置：中心；
字体大小：24px；
字体系列：Arial、Helvetica、无衬线字体；
线高：60px；
位置：相对位置；
-webkit过渡：颜色0.5s至0.0s；
-moz过渡：颜色0.5s到0.0s；
-ms转换：颜色0.5s至0.0s；
-o型过渡：颜色0.5s至0.0s；
过渡：颜色0.5s到0.0s；
}
.导航栏a:悬停{
颜色：#D4B906；
}
.标题#徽标{
高度：200px；
宽度：504px；
右边距：自动；
左边距：自动；
z指数：4；
}
.navbar.show，a:悬停span{
显示：无；
}
.navbar a:悬停。显示{
显示：内联；
}
.包装工{
位置：固定；
高度：73px；
宽度：100%；
文本对齐：居中；
z指数：8；
}
.navbar2{
位置：相对位置；
高度：73px；
宽度：880px；
右边距：自动；
左边距：自动；
背景图像：url（../images/Header3.png）；
背景重复：无重复；
背景位置：中心；
背景色：#FF0；
}
.导航条2.导航阴影{
盒影：0 5px40px-15px黑色；
高度：65px；
宽度：745px；
右边距：自动；
左边距：自动；
位置：相对位置；
左：-2px；
}
.navbar2.menu2{
列表样式类型：无；
填充：0；
右边距：自动；
左边距：自动；
文本对齐：居中；
边际上限：0；
页边距底部：0；
线高：100px；
}
纳瓦巴利先生{
显示：内联；
}
.navbar2 li:第n个孩子（1）{
右侧填充：5px；
左侧填充：10px；
}
.navbar2 li:第n个孩子（2）{
右边填充：10px；
左侧填充：10px；
}
.navbar2李：第n个孩子（3）{
右边填充：145px；
左侧填充：145px；
}
.navbar2李：第n个孩子（4）{
右侧填充：5px；
左侧填充：5px；
}
.navbar2李：第n个孩子（5）{
右侧填充：5px；
左侧填充：5px；
}
.navbar2 a{
文本对齐：居中；
文字装饰：无；
字体系列：Arial、Helvetica、无衬线字体；
颜色：#7A6E00；
字号：18px；
-webkit过渡：颜色0.5s至0.0s；
-moz过渡：颜色0.5s到0.0s；
-ms转换：颜色0.5s至0.0s；
-o型过渡：颜色0.5s至0.0s；
过渡：颜色0.5s到0.0s；
}
.NAVBAR2A:悬停{
颜色：#FFF；
}

柠檬树
$（文档）.ready（函数（）{
$（“html”）.nicesroll({
光标颜色：“FF0”
});
});
html{
背景：url（images/BG.jpg）无重复中心固定；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
背景色：#FFF；
}
身体{
边际：0px；
}	


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

   /* Page 1 */
.wrapper .contentpagewrapper1 {
    width: 650px;
    margin-right: 125;
    margin-left: 125;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 6;
    opacity: 1;
    display: block;
    overflow: auto;
}
.wrapper .contentpagewrapper1::-webkit-scrollbar {
    display: none;
}
/* Some more of your unchanged code */
.wrapper .header2 {
    position: relative;
    height: 73px;
    width: 100%;
    text-align: center;
    z-index: 8;
}