惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Recent Announcements
Recent Announcements
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
B
Blog
T
The Blog of Author Tim Ferriss
J
Java Code Geeks
腾讯CDC
D
Docker
G
Google Developers Blog
D
DataBreaches.Net
雷峰网
雷峰网
Blog — PlanetScale
Blog — PlanetScale
S
SegmentFault 最新的问题
The Cloudflare Blog
有赞技术团队
有赞技术团队
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Stack Overflow Blog
Stack Overflow Blog
大猫的无限游戏
大猫的无限游戏
量子位
美团技术团队
aimingoo的专栏
aimingoo的专栏
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Engineering at Meta
Engineering at Meta
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

饭喵

关于python使用支付宝当面付报错的解决方案 – 饭喵 备份hassos的备份 – 饭喵 使用小爱同学语音控制home assistant – 饭喵 当网页启用gzip压缩时,node-red GET请求乱码的解决方案 – 饭喵 以ubuntu为例在esxi安装虚拟机 – 饭喵 esxi中的网络拓扑图 – 饭喵 openWRT设置host文件 – 饭喵 ubuntu部署seafile以及Nginx 环境下部署 Seahub/SeafServer – 饭喵 基于ESXI的硬件虚拟化软路由+HTPC+NAS全攻略 – 饭喵
写了一个响应式可自定义的简洁导航 – 饭喵
作者: 凉拌炒蛋炒饭 · 2021-10-28 · via 饭喵

写了一个响应式可自定义的简洁导航

效果预览:

https://blog.fanmiao.site/nav/

已经放到了GitHub

https://github.com/imwyh/nav

使用方法

编辑bd.js中的json,添加自定义导航页面或者搜索页面。

最终JS根据bd内容生成完整网页。

技巧

1.输入框回车直接使用默认搜索。

2.输入内容后可用方向键上下选择搜索引擎。

3.点击默认搜索(如demo中谷歌)没有任何反应是为了兼容移动端无法区分click和hover。

4.双击输入框清空内容。

5.可以设置一个默认网页使click搜索引擎时直接前往。

6.鼠标或者触屏滑动中间div部分可左右切换页。

注意事项

1.编辑json时小心标点符号。

2.可以编辑index.html中最后一行script修改动态背景。

3.可以编辑include/style.css中:root修改配色。

4.可以编辑include/style.css最后的#background修改背景颜色。

5.到这个链接获取或者修改mdi图标:https://materialdesignicons.com/ (此网页加载较慢)。

6.没有合适mdi图标可以直接使用文字代替,bd.js有示范。