位置: 编程技术 - 正文

jQuery插件之Tocify动态节点目录菜单生成器附源码下载(jquery插件之家)

编辑:rootadmin

推荐整理分享jQuery插件之Tocify动态节点目录菜单生成器附源码下载(jquery插件之家),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery插件使用教程,jquery插件之家,jquery插件大全,jquery 插件写法,jquery插件使用,jquery插件大全,jquery tooltip,jquery tooltip,内容如对您有帮助,希望把文章链接给更多的朋友!

Tocify是一个能够动态生成文章节点目录的jQuery插件。假如我们有一篇很长的文章,文章有多个节点,那么使用Tocify可以根据节点元素动态生成文章目录,点击目录可以平滑滚动到对应的节点,当然当滚动页面时,目录结构会根据当前监听到的节点进行切换到当前目录状态。

效果展示 源码下载

Tocify目前支持Twitter Bootstrap和jQueryUI Themeroller两种主题风格,我们可以根据实际项目任选其中一种风格,另外必要条件jQuery 1.7.2+和jQueryUI Widget Factory 1.8.+。放心在IE7+即现代浏览器上使用。

引入CSS和Javascript文件

css文件

JavaScript文件

HTML结构

jQuery插件之Tocify动态节点目录菜单生成器附源码下载(jquery插件之家)

创建一个DIV标签,然后给这个标签添加一个ID或者Class,例如:toc

这个div#toc它默认是空的内容,它用来动态生成文章目录,那文章目录如何动态关联文章节点的呢?我们还需要把文章节点做一些规划,如:

以上的HTML结构代码大家可以修改tocify的CSS文件来满足你项目视觉的需求。

Javascript

使用jQuery选择选中我们的toc元素,然后通过tocify()方法调用Tocify插件。

如此,运行网页,一个动态的文章目录就生成了。

选项设置

Tocify提供了丰富的选项设置,我们可以根据项目实际需求设置不同的选项参数。以下是主要的几个参数选项介绍:

选项 说明 默认值 context 任意可用的jQuery选择器 "body" selectors 文章节点,可以关联生成目录 "h1,h2,h3" showAndHide 是否展示二级目录结构 true showEffect 目录展示效果:"none", "fadeIn", "show", or "slideDown" "slideDown" showEffectSpeed 目录展示速度:"slow", "medium", "fast", 或数字(毫秒) "medium" hideEffect 目录隐藏效果:"none", "fadeOut", "hide", "slideUp" "none" hideEffectSpeed 目录隐藏速度:"slow", "medium", "fast", 或数字(毫秒) "medium" smoothScroll 当点击目录节点菜单时,是否平滑滚动到文章对应的节点内容 true smoothScrollSpeed 平滑滚动速率,可以是数字(毫秒) or String: "slow", "medium", or "fast" "medium" scrollTo 当页面滚动时,页面顶端与目录之间的间隔 0 showAndHideOnScroll 当滚动页面时,是否显示和隐藏目录子菜单 true theme 内容展示风格,可以是"bootstrap", "jqueryui", or "none" "bootstrap"

jQuery CSS3相结合实现时钟插件 废话不多说了,直接给大家贴代码了。效果图如下所示:简洁代码如下:linkrel="stylesheet"href="

jQuery页面刷新(局部、全部)问题分析 本文实例分两部分对jquery刷新问题进行介绍,第一部分介绍了呢页面局部刷新;第二部分介绍了页面全部刷新第一:页面局部刷新jQuery对Ajax操作进行了

jquery调整表格行tr上下顺序实例讲解 表格是大家比较常用的元素,有时候表格中的行需要调整顺序,下面就通过代码实例介绍一下如何利用jquery实现此功能,分享给大家供大家参考,具体

标签: jquery插件之家

本文链接地址:https://www.jiuchutong.com/biancheng/379281.html 转载请保留说明!

上一篇:jQuery抛物线运动实现方法(附完整demo源码下载)(抛物线动画演示视频)

下一篇:jQuery CSS3相结合实现时钟插件(jqueryw3c)

  • 税务局纳税申报网站官网
  • 出租房怎么算平方多少
  • 企业所得税的纳税人发生年度亏损的时间
  • 会计凭证销毁方法
  • 公益组织收到捐赠款计入什么科目
  • 服务费的增值税怎么算
  • 业务活动成本和业务活动费用的区别
  • 成品油红字发票开错了
  • 2021年超市发票税率是多少
  • 关税的税收主体是外国的进出口商
  • 公司购买的货架入哪个科目
  • 发票备注没写
  • 房地产收入成本确认
  • 飞机票的快递费多少钱
  • 劳务公司开票税收分类
  • 收回已转销的坏账在借方还是贷方
  • 提供教育服务免征增值税文件
  • 外商投资企业采取发包、出租经营
  • 一般纳税人公司卖车怎么做账
  • 公司拍摄费计入什么科目
  • 制造费用的核算程序是什么
  • 一次性离职补偿个税
  • 自然人出租房屋房产税
  • 半成品牛排有营养吗
  • 可全额扣除的公益性捐赠支出
  • 收到的产品返利怎么做账
  • 坏账准备转回影响应交所得税吗
  • 周围的材料分为哪几类
  • 高新技术企业研究开发费用加计扣除
  • 工业企业生产成本核算表
  • 苹果客服人工24小时
  • 购货方销售退回怎么做账
  • 汇算清缴是哪个报表
  • wordpress访客记录怎么看
  • 如何修改选区边缘
  • 跨年冲减无发票怎么入账
  • win10开机强制进入修复模式
  • 预付购买材料款属于什么会计科目
  • three.js入门指南
  • vue docx-preview实现docx文件在线预览
  • elementui form rules
  • php强制下载文件在哪
  • 后浪是什么意思网络用语
  • 个体工商户注册需要什么材料
  • 物流公司的会计好干吗
  • 转让不动产为什么能差额
  • 运用java解决的实际问题
  • 差旅费计入工资合理吗
  • sql server 2008使用说明
  • 企业发生的职工福利费支出,不超过工资
  • 普票是啥意思
  • 个税专项附加扣除什么意思
  • 增值税加计扣除怎么算举例
  • 企业每月营业额达多少需要交税
  • 公司购买的商品质量问题能用12315投诉吗
  • 对于审核后的凭证可直接修改对吗
  • 财务负责人和办税员可以是一个吗
  • 软件租赁费入什么账户
  • 把excel表格里的文字复制到word
  • mysql 高效分页
  • swupdtmr.exe - swupdtmr进程是什么意思 什么作用
  • SymSPort.exe - SymSPort是什么进程 有何作用
  • windows8使用教程
  • Mac借助其他电脑做系统
  • centos设置双网卡
  • windows 8怎么样
  • Win10预览版镜像
  • 服务器不支持密码鉴定
  • linux三种用户权限
  • win8启动蓝屏
  • win10mobile官网
  • cocos2dx怎么用
  • android开机自启动显示界面
  • linux dig命令
  • vuejs环境搭建
  • 批处理技术有哪些
  • javascript基础
  • jQuery实现的指纹扫描效果实例(附演示与demo源码下载)
  • 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache详解
  • jquery控制display属性
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设