jquery - 向右滚动时，div 停在屏幕左侧

Question

我有一个快速的 jQuery/css 问题。我正在编写一个网站，并且有一个灰色框，其中包含内容/链接，当用户向右滚动时，我想将其粘贴到屏幕的左侧。我浏览了一堆论坛/教程，但仍然找不到我的解决方案。这是该网站的链接。

当谈到 jQuery 时，我是一个新手，所以任何帮助将不胜感激，谢谢！

http://morseandcompany.com/index-TEST.html

Answer 1

访问您的网页时，我收到此错误：

var docScrollRight = $('body,html').scrollRight();
                                    ^^^^^^^^^^^

那不是 jQuery 函数。试试scrollLeft()。

Answer 2

编辑：

这应该是您的文档就绪脚本：

$(document).ready(function() 
{
    var theLoc = $('#sidebar').position().left;
    $(window).scroll(function() {
    if(theLoc >= $(window).scrollLeft()) {
        if($('#sidebar').hasClass('fixed')) {
            $('#sidebar').removeClass('fixed');
        }
    } else { 
        if(!$('#sidebar').hasClass('fixed')) {
            $('#sidebar').addClass('fixed');
        }
    }
});
});

将此添加到您的 CSS 中：

.fixed {position:fixed !important; left:0px !important;}

并将#sidebar 的 CSS 更改为：

#sidebar {
min-height:100%;
width:266px;
height:100%;
height: auto !important; /*for modern browsers */ 
background-color:#F2F2F2;
z-index:2;
} 

并将侧边栏的 HTML 更改为：

<DIV ID="sidebar" style="position:absolute; left:765px;"></DIV>