conflunce设置浮动导航方法,提高效率

38 篇文章 1 订阅
订阅专栏

背景

我们文档很长时,即使添加了目录,每次想要找到对应内容时,也需要回到文章的开头去找目录,而且目录很长,找起来就很麻烦,于是我就想起来,把目录变成浮动的,这样就不需要哦把页面翻来翻去,不用浪费时间在回到文章开头,提高读取文档的效率

我们自己的文章添加浮动目录

方法一:添加用户自定义宏,这种方式需要有confluence超级管理员权限才能操作
方法二:在我们的文章里添加普通目录宏,然后再添加html宏,把下面代码插入到HTML宏内容中就可以
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

效果图:
在这里插入图片描述

<!-- 创建一个浮动的右侧导航div --> 
<div id='my_toc_div' style="width: 350px; position: fixed; bottom: 20px;right: 25px; z-index: 100; background: rgb(227 227 227 / 78%);"> 
<div style="padding: 8px;text-align: center;background: linear-gradient(45deg, black, transparent);color:#fff"><strong>导航目录</strong></div> 
<div id='my_toc' style="width: 350px;height:500px; overflow:auto;  margin-bottom: 30px;">
</div>
</div>
<button style="position: fixed; bottom: 20px;right: 25px; z-index: 110;background-color: coral;"  
	class="aui-button aui-button-primary" onclick="toggle_toc()">
    隐藏/显示
</button > 
<script>     
function move_toc_to_my_div() {
	var origin_toc_html = $('.toc-macro');
	$('#my_toc').append(origin_toc_html);
};
function toggle_toc() {
	if ($("#my_toc_div").is(":hidden")) {
		$("#my_toc_div").slideToggle(); 
	} else {
		$("#my_toc_div").slideToggle(); 
	}
}
$(move_toc_to_my_div);
 </script>

别人的文章,变成浮动目录

别人的文章我们没办法修改,所以只能添加脚本方式把目录变成浮动的,方式如下
步骤一:浏览器添加书签,书签名自己定,url内容是下面代码
步骤二: 打开别人的文档,当有目录存在时,点击我们步骤一的书签,就可以把目录变成浮动的
代码和效果图如下:

javascript:$("#content").append("<!-- 创建一个浮动的右侧导航div -->

<div id=\'my_toc_div\' style=\"width: 350px; position: fixed; bottom: 20px;right: 25px; z-index: 100; background: rgb(227 227 227 / 78%);\"> 
<div style=\"padding: 8px;text-align: center;background: linear-gradient(45deg, black, transparent);color:#fff\"><strong>导航目录</strong></div> 
<div id=\'my_toc\' style=\"width: 350px;height:500px; overflow:auto;  margin-bottom: 30px;\">
</div>
</div>
<button style=\"position: fixed; bottom: 20px;right: 25px; z-index: 110;background-color: coral;/*border:1px solid black;width: 70px;height:30px;  text-align:center;line-height:30px; */\"  
	class=\"aui-button aui-button-primary\" onclick=\"toggle_toc()\">
    隐藏/显示
</button >");
function move_toc_to_my_div() {
	var origin_toc_html = $('.toc-macro');
	$('#my_toc').append(origin_toc_html);
};
function toggle_toc() {
	if ($("#my_toc_div").is(":hidden")) {
		$("#my_toc_div").slideToggle(); 
	} else {
		$("#my_toc_div").slideToggle(); 
	}
}
$(move_toc_to_my_div);

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

【云原生】Docker搭建知识库文档协作平台Confluence
congge_study的博客
07-27 4318
Docker搭建知识库文档协作平台Confluence
Confluence 增加浮动导航目录
CoLiuRs
02-21 1033
Confluence浮动导航目录
11.CSS基础_浮动(float)_导航
安小静--
10-18 399
一般情况下导航栏都会使用到浮动的知识,这一节写一个简单的导航栏,代码如些: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>导航栏</title> <style type="text/css"> .menu{ wid...
Confluence浮动导航目录
sinat_34066134的博客
10-25 3495
文章目录Confluence 页面添加浮动导航目录添加自定义用户宏在页面中添加导航目录 Confluence 页面添加浮动导航目录 添加自定义用户宏 1、设置-一般配置-用户宏-创建用户宏 2 3、 在页面中添加导航目录 编辑文章时,插入其他宏,选择 浮动目录导航 即可。 ...
右侧常用浮动导航
weixin_34392435的博客
01-05 483
<div class="right_nav"> <p class="right1"><a href="#" target="_self">收藏本页</a></p> <p class="right1 right2"><a href="#" target="_self">分享活动</a&gt...
网页右侧浮动导航
kataerdeshui的专栏
12-14 1748
XXXX XXXX XXXX XXXX XXXX XXXXX #navi{background:url(/activity/newyear/images/navi.jpg) center no-repeat;width:110px;height:250px;position:fixed;_position:absolute;right:20px;top:200px;_top
Confluence 6 修改导航显示选项
HONEY MOOSE
12-10 1122
选择 子页面(Child pages)来在边栏中查看当前页面的子页面。 选择 页面树(Page tree)来查看整个空间的页面树,扩展当前的页面。 你也可以选择是否完全隐藏导航显示选项或者添加你希望可见的快捷链接。可选的你可以使用 Page Tree Macro or Children Display Macro 宏在你的页面中显示内容导航链接而不是在边栏中显示使用导航链接。   htt...
浮动_style_浮动导航栏_css如何浮动_
09-29
为了解决这个问题,可以使用`clearfix`方法或者CSS3的`display: flex`或`display: grid`来代替传统的浮动布局。 总的来说,浮动导航栏是通过CSS的`position`和`float`属性实现的,它可以提供良好的用户体验,使用户...
jQuery 实现侧边浮动导航菜单效果
10-25
在制作网页时,侧边浮动导航菜单是一种常见的导航形式,它可以有效地引导用户快速找到网站上的不同内容...总之,通过以上步骤和方法,可以实现一个实用且美观的侧边浮动导航菜单,从而提升网站的导航效率和用户体验。
jQuery 浮动导航菜单适合购物商品类型的网站
10-25
在现代网页设计中,为了提升用户体验...最终,浮动导航菜单可以帮助购物网站构建起一个清晰、直观的用户界面,不仅能够提升用户的浏览效率,也能加强用户对网站内容的探索欲望,从而提升整个网站的转化率和用户满意度。
微信小程序实现页面浮动导航
10-17
`selectNavigationItem`方法处理导航项的点击事件,更新当前选中的导航项,并通过`setData`设置`isFloat`为`false`,使导航回到原位。同时,调用`wx.pageScrollTo`滚动到页面顶部,加载相应的数据。 `onPageScroll`...
jquery仿百度百科底部浮动导航特效
01-19
jquery类似百度百科底部导航预览,代码很简单,这里就不多废话了。 效果图: CSS  * { margin: 0; padding: 0 } .wrap { width: 1000px; overflow: hidden; margin: 0 auto; } .content { width: 780px; float: left; } .slide { width: 200px; float: right; } HT
jquery特效制作左侧侧边浮动导航菜单滑动显示或隐藏
09-17
17素材的资源,下载还要积分,专门扒下来的,jquery 后台左侧点击折叠关闭功能,不是折叠菜单哦
固定导航浮动在顶部效果html代码
08-06
单一一个固定导航浮动在顶部效果html源代码,导航固定在顶部,浮动在最上层,不随页面的下拉而改变。
超过一定高度出现左右浮动导航及底部固定导航代码悬浮漂浮
11-19
首先,我们可以为左右浮动导航设置浮动属性,如`float: left`或`float: right`,并设置适当的宽度和位置。然后,通过JavaScript或jQuery监听滚动事件,当页面滚动到一定高度时,使用`addClass`或`removeClass`方法...
浮动导航栏php源码,Float浮动导航
weixin_42282482的博客
03-12 113
摘要:&浮动导航条*{margin: 0px; padding: 0px;}ul li{list-style: none;width: 120px;height: 30px;background-color: black;color: aliceblue;line-height: 30px;text-align: center;margin: 1px 0.5px;float: left;}...
confluence插入代码框以及格式设置
热门推荐
chengde6896383的专栏
09-27 2万+
"RDark"主题
Confluence浮动目录导航 -- 用户宏方式
szguomy的专栏
11-21 7027
宏代码出处:https://github.com/Poil/confluence-usermacro/blob/master/toc-right 设置 &gt; 一般配置 &gt; 用户宏 &gt; 创建用户宏   在模板中添加以下代码: ## Macro title: toc-right ## Macro has a body:  N ## ## Developed by:...
CSS浮动目录
qq_43776742的博客
07-31 700
浮动介绍
怎么设置浮动静态路由
最新发布
08-17
设置浮动静态路由通常是在网络配置中的一种策略,用于在网络层次结构中为特定目的地址分配IP地址,同时允许这些地址可以根据需要动态地更改。以下是一个简单的步骤说明: 1. **理解需求**:首先确定为什么需要浮动静态路由,可能是为了负载均衡、冗余或多租户环境。 2. **选择合适的路由器**:确认路由器是否支持浮动IP功能,比如在Linux下的iptables、Quagga之类的网络管理工具。 3. **配置IP池**:创建一个IP地址范围,这将是浮动IP的来源。例如,在iptables中可以创建一个专门的网络子网。 4. **配置静态路由**:在路由表中添加一条静态路由,指定源IP(浮动IP),目标网络和下一跳地址。比如,`ip route add <漂移IP> dev <接口名称> table <路由表名>`。 5. **启用浮动**:配置路由器监听请求,当接收到对浮动IP的连接请求时,动态从IP池中选择一个未使用的IP并分配给连接。 6. **监控和更新**:定期检查浮动IP的使用情况,并根据需要调整路由或更新IP池。 7. **注意事项**:确保防火墙规则允许流量到达浮动IP,以及在服务器层面处理IP变化可能导致的服务中断。
写文章

热门文章

  • java 百万千万级别excel数据导出问题(解决导出慢和OutOfMemoryError内存溢出的问题) 10928
  • 百度网盘 自定义分享密码 提取码 10623
  • 推荐:大文件查找,快速扫描,图像分析并清理硬盘垃圾文件的绝佳好工具! 9935
  • Elasticsearch 7.4(Windows 系统) 指定单独JDK版本 9601
  • MySQL 快速导入数据指令load Data 详解 8958

分类专栏

  • Spring框架 6篇
  • java基础 22篇
  • MySQL 6篇
  • JS 3篇
  • 微服务框架 4篇
  • 中控考勤机 3篇
  • RabbitMQ 3篇
  • 项目管理 1篇
  • 系統安裝
  • Elasticsearch 2篇
  • 笔记 38篇

最新评论

  • conflunce设置浮动导航方法,提高效率

    3分天注定七分靠打拼: 谢谢大佬,亲测可用。表情包

  • 记录一个IDEA中使用GIT的严重BUG,导致测试分支合并到主分支,以及代码恢复解决方案

    huihttp: 按文章恢复一下就好了

  • 记录一个IDEA中使用GIT的严重BUG,导致测试分支合并到主分支,以及代码恢复解决方案

    w307145506: 应该也是一样的原因

  • 记录一个IDEA中使用GIT的严重BUG,导致测试分支合并到主分支,以及代码恢复解决方案

    w307145506: 我也遇到了,很尴尬,明明没有test分支合并到自己的分支的操作,但是自己建的分支合并master分支的时候出现了test分支的代码表情包

  • 记录一个IDEA中使用GIT的严重BUG,导致测试分支合并到主分支,以及代码恢复解决方案

    huihttp: 我的是中文版的idea,你看下英文版应该是 help菜单里有个log相关的

大家在看

  • 如何在 MySQL Workbench 中修改表数据并保存??
  • 《谷粒商城实战》-3、代码环境配置、开发工具安装 265
  • 文字版格斗游戏
  • 《谷粒商城实战》-5、搭建数据库以及配置人人开源后台框架 711
  • Java基于SpringBoot的甘肃旅游特产网站+Vue[毕业设计]

最新文章

  • 目前有关数字人的开源项目[转]
  • MySQL 快速导入数据指令load Data 详解
  • 小程序和H5中canvas卡顿的性能优化方向和实践
2024年1篇
2023年1篇
2022年10篇
2021年19篇
2020年7篇
2019年4篇
2016年1篇
2015年2篇

目录

目录

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

huihttp

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或 充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值

玻璃钢生产厂家商场棉衣墙面美陈创意湖北玻璃钢牛雕塑滨州市玻璃钢雕塑厂周口佛像玻璃钢雕塑唐山玻璃钢雕塑定制西宁玻璃钢动物雕塑设计水景玻璃钢景观雕塑生产铸铜玻璃钢仿铜雕塑定制宣城抽象玻璃钢雕塑批发四川玻璃钢酒店人物雕塑碱水池泡玻璃钢雕塑视频河南室内玻璃钢雕塑设计玉林玻璃钢雕塑湖南玻璃钢雕塑公司重庆玻璃钢蔬菜雕塑厂常用商场美陈销售厂家惠州玻璃钢雕塑躺椅新乡锻铜玻璃钢仿铜雕塑发光玻璃钢雕塑人像重庆多彩玻璃钢雕塑优势秭归玻璃钢花盆花器河南玻璃钢造型雕塑批发广场玻璃钢雕塑工厂通渭玻璃钢雕塑销售河北大型商场创意商业美陈公司评价高的玻璃钢花盆聊城玻璃钢雕塑设计泸州玻璃钢人物雕塑定制焦作附近玻璃钢景观雕塑厂家北流玻璃钢雕塑香港通过《维护国家安全条例》两大学生合买彩票中奖一人不认账让美丽中国“从细节出发”19岁小伙救下5人后溺亡 多方发声单亲妈妈陷入热恋 14岁儿子报警汪小菲曝离婚始末遭遇山火的松茸之乡雅江山火三名扑火人员牺牲系谣言何赛飞追着代拍打萧美琴窜访捷克 外交部回应卫健委通报少年有偿捐血浆16次猝死手机成瘾是影响睡眠质量重要因素高校汽车撞人致3死16伤 司机系学生315晚会后胖东来又人满为患了小米汽车超级工厂正式揭幕中国拥有亿元资产的家庭达13.3万户周杰伦一审败诉网易男孩8年未见母亲被告知被遗忘许家印被限制高消费饲养员用铁锨驱打大熊猫被辞退男子被猫抓伤后确诊“猫抓病”特朗普无法缴纳4.54亿美元罚金倪萍分享减重40斤方法联合利华开始重组张家界的山上“长”满了韩国人?张立群任西安交通大学校长杨倩无缘巴黎奥运“重生之我在北大当嫡校长”黑马情侣提车了专访95后高颜值猪保姆考生莫言也上北大硕士复试名单了网友洛杉矶偶遇贾玲专家建议不必谈骨泥色变沉迷短剧的人就像掉进了杀猪盘奥巴马现身唐宁街 黑色着装引猜测七年后宇文玥被薅头发捞上岸事业单位女子向同事水杯投不明物质凯特王妃现身!外出购物视频曝光河南驻马店通报西平中学跳楼事件王树国卸任西安交大校长 师生送别恒大被罚41.75亿到底怎么缴男子被流浪猫绊倒 投喂者赔24万房客欠租失踪 房东直发愁西双版纳热带植物园回应蜉蝣大爆发钱人豪晒法院裁定实锤抄袭外国人感慨凌晨的中国很安全胖东来员工每周单休无小长假白宫:哈马斯三号人物被杀测试车高速逃费 小米:已补缴老人退休金被冒领16年 金额超20万

玻璃钢生产厂家 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化