当前位置:首页文章笔记建站教程WordPress 主题侧边栏随窗口浮动

WordPress 主题侧边栏随窗口浮动

现在大部分 WordPress 主题其实都自带侧边栏随窗口浮动功能,但这类需求依然存在,今天小编教你如何不用 WordPress 插件轻松实现。

操作流程:

将下面的 javascript 代码插入到当前 WordPress 主题头部 header.php 模版中。修改其中的“#sidebar”为 WordPress 主题侧边选择器名称;根据不同的主题头部模版高度,适当调整其中的数字“368”。

  1. <script type="text/javascript">
  2. var documentHeight = 0;
  3. var topPadding = 15;
  4. $(function () {
  5. var offset = $("#sidebar").offset();
  6. documentHeight = $(document).height();
  7. $(window).scroll(function () {
  8. var sideBarHeight = $("#sidebar").height();
  9. if ($(window).scrollTop() > offset.top) {
  10. var newPosition = ($(window).scrollTop() – offset.top) + topPadding;
  11. var maxPosition = documentHeight – (sideBarHeight + 368);
  12. if (newPosition > maxPosition) {
  13. newPosition = maxPosition;
  14. }
  15. $("#sidebar").stop().animate({
  16. marginTop: newPosition
  17. });
  18. } else {
  19. $("#sidebar").stop().animate({
  20. marginTop: 0
  21. });
  22. };
  23. });
  24. });
  25. </script>
温馨提示:

文章标题:WordPress 主题侧边栏随窗口浮动

文章链接:https://www.wuyanshuo.cn/1341.html

更新时间:2022年09月15日

本站大部分内容均收集于网络!若内容若侵犯到您的权益,请发送邮件至:service@wuyanshuo.cn我们将第一时间处理! 资源所需价格并非资源售卖价格,是收集、整理、编辑详情以及本站运营的适当补贴,并且本站不提供任何免费技术支持。 所有资源仅限于参考和学习,版权归原作者所有,更多请阅读无言说网络服务协议

给TA打赏
共{{data.count}}人
人已打赏
建站教程

WordPress 自定义文章类型添加后台分类筛选

2022-9-15 5:02:08

建站教程

WordPress 怎么对普通用户屏蔽后台菜单

2022-9-15 10:58:31

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