高性能jQuery固定侧边栏插件

2018102105014586

sticky-sidebar.js 是一款高性能的 js 固定侧边栏插件。通过 sticky-sidebar.js 插件,你可以快速的为网站制作出固定侧边栏效果。它的特点还有:

在页面滚动是,不需要重新计算所有的坐标,金辉计算必要的坐标。

页面平滑滚动,不会产生页面滚动侧边栏滞后的感觉。

当侧边栏过高或过短时,会自动计算侧边栏的位置。

插件没有任何依赖,使用简单。

使用方法:

在页面中引入 sticky-sidebar.js 文件。

<script type="text/javascript" src="path/to/js/sticky-sidebar.js"></script>

HTML 结构:

要使用 sticky-sidebar.js 固定侧边栏插件,你的网页结构应该如下面的样子。

<div class="main-content">
    <div class="sidebar">
        <div class="sidebar__inner">
            <!-- 侧边栏内容 -->
        </div>
    </div>
    <div class="content">
        <!-- 页面内容 -->
    </div>
</div>

你也可以将 sticky-sidebar.js 固定侧边栏插件和 jquery 或 Zepto 结合使用。要作为 jquery 插件来使用,只需要引入 jquery.sticky-sidebar.js 文件即可,例如:

<script type="text/javascript" src="path/to/js/jquery.js"></script>
<script type="text/javascript" src="path/to/js/jquery.sticky-sidebar.js"></script>
<script type="text/javascript">
  $('#sidebar').stickySidebar({
    topSpacing: 60,
    bottomSpacing: 60
  });
</script>

 

下载权限

查看
  • 免费下载
    评论并刷新后下载
    登录后下载

查看演示

  • {{attr.name}}:
您当前的等级为
登录后免费下载登录 小黑屋反思中,不准下载! 评论后刷新页面下载评论 支付以后下载 请先登录 您今天的下载次数(次)用完了,请明天再来 支付积分以后下载立即支付 支付以后下载立即支付 您当前的用户组不允许下载升级会员
您已获得下载权限 您可以每天下载资源次,今日剩余

给TA打赏
共{{data.count}}人
人已打赏
导航菜单

SelectMenu - 下拉菜单插件

2022-3-2 15:38:48

导航菜单

ContextMenu - 右键菜单插件

2022-3-2 16:07:07

重要声明

本站资源大多来自网络,如有侵犯你的权益请联系管理员-柒村长QQ21660010 我们会第一时间进行审核删除。站内资源为网友个人学习或测试研究使用,未经原版权作者许可,禁止用于任何商业途径!请在下载24小时内删除!


如果遇到付费才可观看的文章,建议升级终身VIP。全站所有资源任意下免费看”。本站资源少部分采用7z压缩,为防止有人压缩软件不支持7z格式,7z解压,建议下载7-zip,zip、rar解压,建议下载WinRAR

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索