折腾Next主题中的motion.js

折腾Next主题中的motion.js

Next主题中的motion.js和网站中的动画有关,因此像我这种喜欢自定义样式和动画的用户还是很有必要研究一下motion.js的具体内容。同时,在研究这个js文件的同时,也能顺便提高一下我的javascript能力,何乐而不为呢?

1. jQuery 事件 - ready() 方法

  • 当DOM已经加载,并且页面(包括图像)已经完全呈现时,会发生ready事件。

  • 由于该事件在文档就绪后发生,因此把所有其他的jQuery事件和函数置于该事件中是非常好的做法。

  • ready()函数规定当ready事件发生时执行的代码。
  • ready()函数仅能用于当前文档,因此无需选择器。
  • ready()函数不应与<body onload="">一起使用。

1
2
3
$(document).ready(function)	/* 写法1 */
$().ready(function) /* 写法2 */
$(function) /* 写法3 */

快速浏览了一下整个js文件,发现有三个动画:

  1. 侧边栏按钮动画

  2. 标题动画

  3. 侧边栏弹出/弹回动画

好了,知道这三个动画所在的位置,相信只要读者稍微会一点javascript应该就会自己修改成自己的想要效果了~

(逃