个人博客评论系统:Valine 之前我也写过一篇个人博客的评论系统:Gitalk。 https://zhuanlan.zhihu.com/p/141078552 但是这个评论系统有一个不太好的地方,它需要使用GitHub账号才能够进行评论,这就涉及到很多人不想暴露自己的隐私或者没有GitHub账号就无法进行评论。 所以当我在重新搭建我的个人博客时,找了一款新的评论系统:Valine。 https://valine.js.org/ 2020-06-24 blog 个人博客
Vue服务器渲染优秀项目:Nuxt.js 1. 服务器渲染1. 1 什么是服务器渲染Vue.js 服务器端渲染指南 Vue官网已经对服务器渲染讲解的很详细了,可以直接参考上面的文档。不过就是因为讲解的太过于全面,所以有时候可能看的一头雾水。 1.2 为什么需要服务器渲染更好的 SEO,搜索引擎的爬虫抓取工具可以直接查看完全渲染的页面。 这段话是什么意思呢,大家可以打开自己的Vue项目,右键查看源代码: 可以看到,不管你的Vue项目有多庞 2020-06-22 Vue 服务端渲染
Viewer.js图片查看器 做界面时可能会需要图片查看的功能,就比如QQ空间查看照片的功能。 虽然这个功能自己实现也不是太难,但是直接引入第三方库有个最大的好处是第三方库一般都经过很多个版本的更新迭代,不管是性能还是体验上一般都优于自己动手写(大佬除外)。 Viewer.js几乎是开源出来的图片查看器中功能最全的库。 1. 安装1.1 npmnpm install viewerjs 1.2 browser<link 2020-06-15 web开发 Viewer.js 图片查看器
打字机效果插件Typed.js 打字机效果是非常酷的文字显示效果,视觉表现极佳,而通过Typed.js可以很简单的在web开发中实现打字机效果。 1. 官网JavaScript Animated Typing with Typed.jsmattboldt 2. 安装# With NPM npm install typed.js # With Yarn yarn add typed.js # With Bower bower 2020-06-15 web开发 动画 Web 开发 打字机
HTML中的瀑布流masonry在Vue中应用 瀑布流,又称瀑布流式布局。是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部。最早采用此布局的网站是Pinterest,逐渐在国内流行开来。国内大多数清新站基本为这类风格。 可以说作为图片的一种展示风格,是非常的好看了,那么在HTML中怎么进行实现呢? 纯CSS实现https://www.bilibili.com/v 2020-06-12 web开发 HTML Vue.js
IOS系统越狱后的自用插件分享 为什么要越狱?众所周知,IOS系统的封闭性要远远高于安卓,虽然现在安卓的很多衍生系统都已经不支持Root了。 正因为IOS的封闭性,所以IOS比起安卓来讲要安全很多,不会因为在滑动APP界面时点到广告就开始下载软件(以前我在用安卓时,那个年代流量还只有不到1G/月时,点到贴吧上面的广告瞬间开始下载软件,花掉不少流量…这个故事告诉我们,4G的速度还是挺快的)。 总之,越狱是为了实现IOS不具备的某些 2020-06-11 IOS 越狱 IOS
用Vue做一个播放器 之前在B站上面看到一个视频: https://www.bilibili.com/video/BV1Yz411z7An?t=16 感觉它的这个播放器挺好看的,原作者是用的PPT制作。 我的设计灵感一向很差,叫我自己设计UI一般会非常难看,于是就准备仿照他这个,用Vue通过web的形式,参照他的界面,做一款播放器玩玩。 目标制作一个简单的播放器,拥有播放,暂停,上一首,下一首,歌曲列表等功能。音乐数 2020-06-06 Vue vue 播放器
GSAP(GreenSock):最健全的web动画库之一 官方的介绍 GreenSock动画平台(GSAP)可以对JavaScript可以操作的所有内容进行动画处理(CSS属性,SVG,React,画布,通用对象等),同时解决了不同浏览器上存在的兼容性问题,而且速度极快(比jQuery 快20倍)。大约有1000万个站点和许多主要品牌都使用 GSAP。 官网https://greensock.com/ 动画其实是每秒多次改变元素属性值,元素看起来就仿佛 2020-06-03 web开发 动画 前端开发 HTML5
利用background制作拉窗帘效果 往往利用CSS可以做出一些意想不到的效果,比如说下面的这个示例: 为了演示随手做的,官网并不是这样 滚动鼠标滚轮,就有一种背景图被覆盖的错觉,之所以说是错觉,并不是背景图真的被覆盖了,其实背景图所在的盒子是跟着下面的图片一起在滚动,只是图片和窗口之间相对没有移动造成的错觉。 可能听起来比较复杂,但是实际上只需要一个属性就能做出这种效果,那就是background-attachment: fixe 2020-06-02 web开发 CSS Web 开发 HTML+CSS
全屏滚动插件fullpage.js 随着前端的飞速发展,现在制作界面时出现了非常多的好看的样式,比如说全屏滚动效果,能够带来很舒服的视觉体验。先来看一下什么是全屏滚动: 这是fullpage.js的官网,只需要滑动一下滚轮,就能实现翻页的效果。 1. 安装fullPage.js中文文档github 如何安装其实文档上面已经说得很清楚了,即: // 使用 bower bower install fullpage.js // 使用 2020-06-01 web开发 HTML5 网页设计