首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

zblogPHP智能侧边跟随固定范围浮动的效果

其实关于主题家这个模板我之前一直在打算找一款插件,可以自动调整右侧的跟随效果,但是苦于没有思路一直没整,前几天网友又反映到这个问题了,于是重新整理查找资料,我记得之前写过一篇“zblogphp侧跟随代码教程... 其中“sidebar”就是侧智能跟随的容器名称,如果你的博客或者网站不是采用这种框架就得自己慢慢摸索,如果是,那么继续 引入JS文件: <script type="text...可用配置参数及说明: containerSelector:<em>侧边</em><em>栏</em>的父容器元素。如果没有指定直接使用<em>侧边</em><em>栏</em>的父元素。 additionalmarginTop:可选值。...指定<em>侧边</em><em>栏</em>的顶部margin值,单位像素,默认为0像素。 additionalMarginBottom:可选值。指定<em>侧边</em><em>栏</em>的底部margin值,单位像素,默认为0像素。...updateSidebarHeight:是否更新<em>侧边</em><em>栏</em>的高度。默认为true。 minWidth:如果<em>侧边</em><em>栏</em>的宽度小于这个值,将恢复为正常尺寸。默认值为0。

80720

jQuery特效 | 导航底部横线跟随鼠标缓动

HTML5学堂(码匠):jQuery来实现如下特效 - 在导航底部存在一条横线,跟随鼠标缓动到相应导航项底部。...今天就针对该特效来说说如何开发(本次内容使用jQuery进行讲解,原生JavaScript代码下周一奉上) 功能效果图 ?...功能需求明确 横向导航条; 当鼠标移入导航区域的时候,在当前导航底部淡入一个横线; 当鼠标在导航区域当中左右移动时,横线跟随鼠标移动; 当鼠标移出导航区域的时候,横线淡出。...导航跟随 - 实现 结构分析 在此功能当中,核心在于结构的搭建,导航底部的横线能够来回运动,那么该横线必然需要定位到当前导航当中,因此可以确定如下的结构代码 ?...hover事件 hover事件是jQuery中的事件,不存在于原生JavaScript当中,是mouseover(鼠标移入)与mouseout(鼠标移出)的功能综合体; hover事件的基本语法为:

8.7K50
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    DOM 和 BOM 中的各种宽高属性

    不包括开发者工具、顶部侧边、滚动条、边框等不由 HTML 控制的部分 window.outerHeight/window.outerWidth: 返回表示窗口的外部高度/宽度的数字。...包括开发者工具、顶部侧边、滚动条、边框等不由 HTML 控制的部分 image.png 1.2 与屏幕相关 window.screen.width/window.screen.height: 返回表示屏幕的宽度...ev.clientX/ev.clientY: 事件发生时,鼠标点击位置相对于浏览器可视区(不包括滚动条和工具)左上角(该点为原点)的坐标。...image.png jQuery width()/height(): 无参时返回元素的 content 的宽度/高度,传参时(数字或者函数)设置元素的 content 的宽度/高度。...scrollLeft()/scrollTop(): 水平方向上或者垂直方向上,滑块相对于整个滚动条的位置。对于某个元素,滑块处于初始位置或者无滚动条时,该方法返回 0。

    1.9K10

    WordPress 初学者词汇表(术语解释)

    Theme(主题) Plugin(插件) Header Menu(菜单) Widget(小部件) Siderbar(侧边) Footer(页脚) Akismet Jetpack SEO(搜索引擎优化)...在 WordPress 中,您可以非常轻松地创建菜单,并且有内置设置可以将菜单分配到特定位置(例如,主菜单、侧边菜单、页脚菜单等)。...在 WordPress 中,小部件用于向Widget Areas(小部件区域)添加内容和功能,例如侧边、页脚或启用小部件的任何其他位置。...Siderbar(侧边侧边显示帖子或页面上的支持内容。一些网站选择不使用侧边,但如果您这样做,您可以放置小部件(例如关于部分、相关帖子、时事通讯订阅表格或其他任何内容)。...根据您的 WordPress 主题(或页面构建器),侧边通常是左侧或右侧的垂直列,尽管根据帖子类型或页面,某些设计可能具有两个侧边甚至自定义侧边

    7.2K20

    Joe主题再续前缘版 - 本站同款

    微信打开网站跳转浏览器的防红功能,打开后QQ内可直接调用QQ浏览器 UC浏览器 打开网址 新增开启关闭文章评论画图模式功能 新增首页文章列表可分别放置移动端和PC端谷歌广告代码,可设置两处展示位置或关闭 新增博主鼠标移入漂浮物可设置显示或隐藏...,检测时出现进行安全验证页面直接判断为未收录 新增可开启对友链进行随机排序功能 1.04 去掉编辑器模块内插入图片和插入链接之后插入的内容两边空格,Test修改为空 去除压缩包内多余文件 移动端情况下侧边头像优化为圆形...新增移动端可设置侧边壁纸显示模式为半屏或全屏 新增可自定义侧边登录注册URL函数 优化移动端当页面已经往下滑动之后点击分类等栏目不会返回顶部 文章收录检测失败后改为手动提交收录 1.05 缩小文章页面列表模块的左边距...BUG 优化注册和找回密码时邮箱发送错误的提示机制 新增如果主题没有配置邮箱那么用户注册时则无需验证码 1.12 优化打开文章导读目录后背景层的模糊效果 优化移动端侧边功能模块的背景为85%的白色透明效果...需要用请使用主题内自定义js代码设置引入 还原移动端侧边和搜索动画,移除毛玻璃效果,因为毛玻璃对页面的性能下拉的太严重了 移除控制台的页面加载计时,减少臃肿性 新增反QQ用户恶意举报功能 新增可开启关闭反蜘蛛爬虫非法扫描

    3K20

    前端-10款web动画插件

    2.基于Layui的可自定义添加删除数据的表格处理插件 如何在网页上编辑表格数据,这通过自己编写JS和CSS实现都是比较麻烦的,jQuery有很多插件可以完成这种功能,比如这款jQuery简易版的Excel...比如这款jQuery美化版复选框checkbox。...5.jQuery侧边多级菜单 适合后台管理页面使用 这是一款基于jQuery侧边多级下拉菜单插件,这个菜单的特点是可以固定在左侧边,当页面滚动时整个菜单可以保持一直可见,方便操作。...类似的菜单插件还有CSS3侧边单页切换小图标菜单和CSS3侧边手风琴菜单,都非常实用。这种菜单非常适合在网站的后台管理页面中使用。 ?...7.HTML5/CSS3超链接图片弹出动画 今天给大家分享一个基于HTML5和CSS3的超链接动画,这个HTML5应用还是比较实用的,它可以让你在鼠标滑过超链接时弹出图片,就像弹出tooltip那样的动画效果

    5.9K50

    前端成神之路-WebAPIs05

    ,离开隐藏2个盒子功能 黄色的遮挡层跟随鼠标功能。...移动黄色遮挡层,大图片跟随移动功能。 1.1.7. 案例分析: 黄色的遮挡层跟随鼠标功能。 把鼠标坐标给遮挡层不合适。因为遮挡层坐标以父盒子为准。 首先是获得鼠标在盒子的坐标。...1.3.3.案例:仿淘宝固定右侧侧边 原先侧边是绝对定位 当页面滚动到一定位置,侧边改为固定定位 页面继续滚动,会让 返回顶部显示出来 1.3.4.案例分析: 需要用到页面滚动事件 scroll.../ banner.offestTop 就是被卷去头部的大小 一定要写到滚动的外面 var bannerTop = banner.offsetTop // 当我们侧边固定定位之后应该变化的数值...页面被卷去的头部 // console.log(window.pageYOffset); // 3 .当我们页面被卷去的头部大于等于了 172 此时 侧边就要改为固定定位

    1.5K10

    某音电脑端网页版自动回复、点赞之js脚本

    = _node.offset(); var _x = x + _p.left + _node.width() * .6; //110要根据浏览器不同做调整,测试环境为edge显示收藏夹.../3.1.1/jquery.min.js")); init(); 里面用到了一个python写的外挂小软件 下载地址: https://pan.baidu.com/s/1IiSvK8DuftEqeaXI9fZIyg...type:"ocrCode",img:图形base64} 识别文字字母等 {type:"detection",img:图形base64} 识别点选文字范围 {type:"slide",targetImg:滑块...base64,backgroundImg:背景base64} 识别滑块 {type:"clickImage",key:"窗口关键字",img:按钮base64} 点击图形按钮 {type:"passKey...{type:"clickPoint",x:X坐标,y:Y坐标} 指定坐标点击鼠标 {type:"move",x:X坐标,y:Y坐标} 移动鼠标 {type:"moveAndClick",x:X坐标,y:

    1.4K21

    「JavaScript 」动画基础 - 01

    黄色的遮挡层跟随鼠标功能。...移动黄色遮挡层,大图片跟随移动功能。 1.1.7. 案例分析: 黄色的遮挡层跟随鼠标功能。 把鼠标坐标给遮挡层不合适。因为遮挡层坐标以父盒子为准。 首先是获得鼠标在盒子的坐标。...1.3.3.案例:仿淘宝固定右侧侧边 原先侧边是绝对定位 当页面滚动到一定位置,侧边改为固定定位 页面继续滚动,会让 返回顶部显示出来 1.3.4.案例分析: 需要用到页面滚动事件 scroll...document.querySelector('.banner'); // banner.offestTop 就是被卷去头部的大小 一定要写到滚动的外面 var bannerTop = banner.offsetTop // 当我们侧边固定定位之后应该变化的数值...window.pageYOffset 页面被卷去的头部 // console.log(window.pageYOffset); // 3 .当我们页面被卷去的头部大于等于了 172 此时 侧边就要改为固定定位

    50010

    常见网页特效案例

    功能需求: 1.鼠标经过轮播图模块,左右按钮显示,离开隐藏左右按钮。 2.点击右侧按钮一次,图片往左播放一张,以此类推,左侧按钮同理。 3.图片播放的同时,下面小圆圈模块跟随一起变化。...5.鼠标不经过轮播图,轮播图也会自动播放图片。 6.鼠标经过,轮播图模块, 自动播放停止。...点击右侧按钮,小圆圈跟随一起变化 可以再声明一个变量控制小圆圈的播放 circle++; // 如果circle == 4 说明走到最后我们克隆的这张图片了.../ banner.offestTop 就是被卷去头部的大小 一定要写到滚动的外面 var bannerTop = banner.offsetTop // 当我们侧边固定定位之后应该变化的数值...页面被卷去的头部 // console.log(window.pageYOffset); // 3 .当我们页面被卷去的头部大于等于了 172 此时 侧边就要改为固定定位

    2.3K40

    解决启用WP-Super-Cache后出现的几个问题

    但还是存在有 2 个问题: ① 文章侧边跟随模块不见了,空出一大片; ② 知更鸟的前台登陆功能失效; ③ WP-PostViews 无法实时显示浏览次数,得缓存刷新后才能显示; ---- 问题①: 在网上找了半天...开始 Debug:进入插件设置,把缓存全部清除,然后打开一篇文章,发现跟随模块又回来了!难道缓存的时候不会缓存侧边么??? 好吧,我继续打开几篇文章,居然发现有的有跟随,有的却没有??...在多次查看之后,发现一个规律,我第一时间打开的文章都会正常存在跟随,而其他文章跟随却不见了!... 更好的解决办法:修改侧边代码,删除前置判断语句,改为强制执行即可。 具体修改方法: 1、编辑知更鸟主题的侧边功能模块 sidebar.php,在代码最后找到下面这段: <?...但是,还是有个问题,知更鸟主题的这个跟随模块是显示访客最近浏览的文章,那都静态化了,还统计毛的最近浏览啊!别人浏览文章的时候,你侧边里头的最近浏览一成不变,有点说不过去!

    2.6K60

    建站日志

    TODO LIST 暂无 2021-08-23 添加打赏榜 2021-07-24 最近Waline评论被恶意攻击了,修改了配置: 评论之前必须先注册登录 评论需要经过审核才可发布 2021-06-05 菜单支持子菜单...2018-12-19 最近发现打开页面略慢略卡,发现是jquery-backstretch的cdn加载不了,原本官网使用的cdn是cloudflare的,现在改成了另一个cdn地址。...于是将jquery-backstretch的cdn修改了官网上最新的,总算变快了。 2018-11-16 将鼠标点击产生的文字设为不可选定。...2018-08-21 最近发现了两个问题: 如果文章不写小标题,是不会生成文章目录的,如果启用了leancloud的阅读计数功能,这时候这篇文章的阅读页面的侧边就会失去affix.js的固定定位效果;...(该bug在火狐浏览器下偶尔会触发,在360浏览器下百分百触发) 如果启用了不蒜子计数,在360浏览器下如果滚动页面时,侧边的底部无法和正文模块的底部持平,侧边底部会比正文模块的短一些。

    4.2K30
    领券