1

最近我发现了 myntra.com 并因其动态的侧边栏而感到惊讶。转到此链接：http ://www.myntra.com/men-casual-shoes并查看侧边栏。通常我们通过 jquery 找到了很多 Sticky 项目。但是如果侧边栏中的内容很大，那就行不通了。

但在 Myntra，他们做得很好。在滚动底部，它会粘在底部，在滚动顶部，它会粘在顶部。

已经有这样的插件可用了吗？或我们如何在 Jquery 中做到这一点。?

4

3 回答 3

1

这应该让您开始使用监视器滚动位置技术：

<html>
<body>
<div id="floatMenu">

</div>
</body>
</html>

jQuery：

var name = "#floatMenu";
var menuYloc = null;

menuYloc = parseInt($("#floatMenu").css("top").substring(0, $(name).css("top").indexOf("px")))
    $(window).scroll(function () {
        offset = menuYloc + $(document).scrollTop() + "px";
        $(name).animate({ top: offset }, { duration: 500, queue: false });
    });

CSS：

#floatMenu {
    border: 1px solid black;
    height: 200px;
    position: absolute;
    width: 100px;
}

body {height:500px;}

工作示例：jsFiddle

更新：

工作示例 2：jsFiddle

于 2012-12-06T14:49:08.720 回答
0

试试那个jquery插件：waypoint

于 2012-12-06T14:40:00.587 回答
0

对于确切的类似 Myntra 的菜单，这可能对您有所帮助 - http://techbrij.com/fixed-sidebar-scrolling-jquery-div

于 2013-02-12T15:10:22.017 回答