位置: 编程技术 - 正文

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年
  • 职工交的商业保险怎么做账
  • 广告发布费属于什么征税项目
  • 开票没有网络可以开票吗
  • 转让企业全部产权属于增值税征税范围。A对B错
  • 民间非营利组织会计制度最新版
  • 业务招待费列支内容
  • 住房贷款利息专项附加扣除是返钱吗
  • 应收账款贷方余额表示什么
  • 营改增后房产土地作价入股该如何做税务处理?
  • 外贸出口企业城市排名
  • 去税务局增加税目需要带什么资料
  • 培训费用开具什么发票
  • 企业哪些可以抵扣增值税
  • 机票的抵扣率是多少
  • 费用的补提利息怎么计算
  • 商贸企业固定资产计提折旧吗
  • 公司注销银行账户流程
  • 稽查查补的税款可以享受即征即退吗
  • 出口企业进项税额转出怎么理解
  • 某市财政收到林业基金收入分录
  • 废品损失涉及的税种
  • 购入电脑一次性扣除
  • 认缴制下实收资本可以一直为零吗
  • wifi安全助手每日提现
  • ati2plab.exe是什么进程 ati2plab进程安全吗
  • 小程序常见问题
  • 加油费属于什么费用类别的
  • docker部署webdav
  • typescript tsconfig
  • php运用
  • 浅析企业坏账产生的原因及对策
  • 技术服务行业增值税税税负率是多少
  • 分公司增值税可以放总公司一起缴纳吗
  • 税控盘开票日期一般截止到下个月几号
  • 消费税为什么要除以1减税率推导公式
  • 中标的费用怎么算
  • 小规模公司的做账要求
  • 承兑能随便给别人看吗
  • 办理进出口权的费用西安
  • 公司购车需要什么材料
  • 单位收到已交个人社保
  • 中标服务费如何赋码
  • 代垫费用开什么发票
  • 研究费用记入什么费用
  • 建筑业异地预缴税款怎么纳税申报
  • 经费开支要求
  • 电力安装工程合同税率能开13%
  • 将税后利润首先用于增加投资
  • 什么叫进项税率
  • 公司不做账不报税有什么后果?
  • 辞退员工 工资
  • 购买商品发生的费用计入
  • 利用ipy做ip地址的管理
  • fedora os
  • solaris命令大全
  • linux ./执行
  • 如何修改apache
  • win7 ready
  • w8系统怎么用
  • windows8为什么不好用
  • win10桌面图标显示错误
  • cocos2d-x教程
  • mvp功能
  • awk指令指定脚本程序
  • cocos2dx-3.0(23) ScrollView 缩放 及 touch新用法
  • jquery使用jsonp
  • [置顶]JM259194
  • 高通平台工具下载
  • 可输入文字查找的软件
  • mac上安装破解软件会怎样
  • 前端jsonp解决跨域
  • python 基础 教程
  • 15号扣税
  • 河北个体工商户年报入口
  • 网约车考试全国过了区域没过
  • 连云港税务局网站
  • 何为标兵称号
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设