OneHtmlNav

这是基于小呆导航的超级精简版本,之所以投入了不少精力折腾这个导航,是之前自己网站的导航有点功能不足,看到了小呆导航有我需要的功能,但是确是基于CMS的,有点复杂我又不想再搭建一个平台,所以就打算去除掉一些不需要的功能,只实现网址导航这个功能,所以就拿过来精简了,由于定的是这个目标所以界面美化什么的就不要追求了,我前端代码能勉强看懂就不错了,所以各位如果有精力可以自己琢磨或者参考官网美化一下

访问小呆导航源项目: github

这是导航界面

主要修改点

去掉了源代码关于CMS的部分,只保留了前端的部分代码

去除了大部分和导航无关或者定制化的代码,只保留了导航的主要功能,也就是搜索和网址推荐

精简了HTML中的各种文件依赖,改为标准库引用网络,非标准的精简去冗余后合并到HTML文件中

去掉了网址和搜索引擎的图片,全部改为文字展示,搜索引擎由img的hover改为button的hover,同时选择后修改button中的文字,显示为对应的引擎名字

更改了引擎列表的数据结构,去掉了图片的链接部分

背景原先是白色的,还可以,不过由于我去掉了所有icon图片,就有点不美观了,就重新通过repeat方式生成了一个带颜色的背景,采用的是base64处理后的图片,就是为了不引入图片文件,但是字符比较多,建议打开文件的时候使用notepad++之类的支持代码折叠和换行的软件进行查看

去除了自带的百度搜索联想功能,有啥各位直接打字就好了,猜词什么的感觉没很么必要去掉了

去掉了搜索词后的删除图标,因此就没有了原先的一键清除输入内容的功能,也是为了不引入图标,以及感觉不是很必要

代码优点:

单文件,简单无文件依赖,就一个html,除了公共的一个css和jquery库,js和css都内嵌在html中了

代码1K行,自注释,想要按需修改的自己看中文注释,写的比较清晰

代码整洁,已经通过工具美化过了,换行什么的都OK,没有做压缩处理,主要是为了给人看,有啥都好改

环境无依赖,电脑直接当网页打开也可,放在服务器目录下直接作为HTML或者添加为php都可以

支持搜索引擎的修改,可以自己添加合适的搜索引擎,这点才是我想要的,大多数导航不是下拉就是点击勾选的有点不给力,这个代码悬浮弹出点击选择的形式很不错

代码基本无冗余,无效的js和css都被我手动一行行清理掉了,废了老大劲了

PC端和手机端都支持,大部分效果和样式我都测试了,没啥问题

程序缺点:

界面略朴素,各位有前端能力的自己修改吧

功能部分是按照我自己的想法来的,如果裁剪过度,建议参考原先项目和网页界面进行修改添加

建议和改进

捐助

为了修改这份代码我也是花费了近一个星期才搞定,很是用心,如果你觉得代码对你有用就拿去用吧,愿意赞助一点的我表示开心,或者分享出去让更多的人使用也是好的

方式一: 支付宝捐助

方式二: 微信捐助

license

这是基于小呆导航MIT协议的代码进行开发的,为了遵守协议规定,license文件和界面声明我都保留了,使用的时候建议大家也遵守协议规定

网址导航html单文件,GitHub - pizzasheep/OneHtmlNav: 单文件html的网络导航页面,简约并不简单...相关推荐

  1. html文件打开是搜索导航,GitHub - bituplink/OneHtmlNav: 单文件html的网络导航页面,简约并不简单...

    OneHtmlNav 这是基于小呆导航的超级精简版本,之所以投入了不少精力折腾这个导航,是之前自己网站的导航有点功能不足,看到了小呆导航有我需要的功能,但是确是基于CMS的,有点复杂我又不想再搭建一个 ...

  2. 微信小程序之网易云音乐(三)- 主页面底部导航、轮播图、歌单及歌曲模块开发

    微信小程序之网易云音乐(三)- 主页面底部导航.轮播图.歌单及歌曲模块开发 前言 一. 主页面底部导航 二. 轮播图区域 三. 歌单区域 四. 歌曲区域 微信小程序之网易云音乐导航 前言 创建一个新模 ...

  3. github安装上传文件基础教学

    GitHub是基于git实现的代码托管.git是目前最好用的版本控制系统了,非常受欢迎,比之svn更好. GitHub可以免费使用,并且快速稳定.即使是付费帐户,每个月不超过10美刀的费用也非常便宜. ...

  4. html js文件域val,js实现文件上传表单域美化特效

    一款效果非常时尚的文件上传表单域美化特效,下面给出制作的简要教程. 先上几个效果饱饱眼福: 使用方法 这些文件上传域的美化使用的方法都是隐藏原生的元素,然后使用一个元素来制作美化效果. @H_502_ ...

  5. github单独下载某个文件或文件夹

    首先下载tortoiseSVN,安装好之后打开github项目的地址,例如https://github.com/rbgirshick/fast-rcnn 单独下载某个文件夹: 如果只需要下载tools ...

  6. 【Flask】 结合wtforms的文件上传表单

    表单中的文件上传 基本的表单渲染,表单类设置等等就不多说了,参看另一个文章即可.但是那篇文章里没有提到对于FileField,也就是上传文件的表单字段是如何处理,后端又是如何实现接受上传过来的文件的. ...

  7. 手机端php mime设置,php,_如何使用MIME协议配合表单在iphone手机上下载文件?,php - phpStudy...

    如何使用MIME协议配合表单在iphone手机上下载文件? 做了一个在线下载音乐网站的工具,使用PHP编写,包含MIME协议中的Content-type&Content-Disposition ...

  8. php 美化js文件,js实现文件上传表单域美化特效_javascript技巧

    一款效果非常时尚的文件上传表单域美化特效,下面给出制作的简要教程. 先上几个效果饱饱眼福: 使用方法 这些文件上传域的美化使用的方法都是隐藏原生的元素,然后使用一个元素来制作美化效果. HTML结构 ...

  9. iOS 【利用Markdown编辑GitHub仓库的README文件】

    最近对它的README.md文件颇为感兴趣.便写下这贴,帮助更多的还不会编写README文件的同学们. README文件后缀名为md.md是markdown的缩写,markdown是一种编辑博客的语言 ...

最新文章

  1. 图解Hbase--大数据平台技术栈07
  2. [Matlab] 线性卷积圆周卷积代码实现
  3. 中国最大的python社区-在python数据框中的每一行中查找最大值
  4. VTK:InfoVis之SCurveSpline
  5. Spring Boot 单元测试详解+实战教程
  6. leetcode784. 字母大小写全排列(回溯)
  7. 【图像处理】彩色图像处理(Color Image Processing)
  8. 面试稳了!网易资深工程师详解运维面经!
  9. java markdown 转 pdf_markdown转为pdf文件
  10. python在线评测系统_怎样做一个 Online Judge(在线评测系统)?
  11. FlashPaper组件——api
  12. Filebeat Filter - Dissect/DNS Reverse
  13. 春季高考计算机专业课试题,春季高考计算机试题总结
  14. 1197:山区建小学
  15. ApacheCN 机器学习译文集 20211111 更新
  16. Android解决输入法自动弹出方法大全
  17. 服务器CPU型号后缀的区别,CPU后缀英文简单科普知识,若能区别字母的含义,选购好CPU不求人...
  18. 新东方托福词汇(List 26 ~ List 30)
  19. paip.花生壳 服务启动失败 以及不能安装服务,权限失败的解决
  20. 利用计算机实现音乐节拍的实时自动跟踪,音乐节拍实时跟踪系统的研究及应用...

热门文章

  1. Rhino C#二次开发笔记
  2. 12个用于数据可视化的JavaScript库
  3. 如旁观者听余华从死亡中谈《活着》
  4. 原始-对偶的概念及写对偶问题的基本方法
  5. 通过python利用Django框架搭建一个属于自己的免费网站(已更新)
  6. Oracle P6软件项目进度控制原则
  7. 2017年软件评测师上午真题
  8. Linux(debian)常用代理设置
  9. storm完全分布式部署
  10. puzzle(0415)七巧板、十四巧板