-
面试后，这件事触动了很多。是一个知道十个还是一个好的开发者因此，花了几天时间研究jQuery源代码，了解jQuery的事件机制、选择器以及浏览器的兼容性如何，此后，您一直试图编写jQuery插件来实现自己的一个小特性。
如上所示，插件的功能是当鼠标位于链接上时移动链接，鼠标离开后链接就归位。
HTML的核心部分是
复制代码代码如下所示：
星期一
星期二
星期三
星期四
如果简单地使用jQuery来实现它，那么第一次开始时的函数就实现了。
复制代码代码如下所示：
$（文档）Ready（函数（）{）
$（# catary ）。Hover（function（）{）
$（这）。动画（{ paddingleft：20px}，{队列：假，持续时间：500 }）；
}函数（）{（）
$（这）。动画（{ paddingleft：0 }，{队列：真的，持续时间：500 }）；
}）；
}）；
现在，我们封装的功能，plugin.js写插件，然后链在HTML文件：
复制代码代码如下所示：
（函数（$）{）
fn.extend（{美元。
/ /插件的名字paddinglist
PaddingList：功能（选项）{
参数和默认值
var默认值= {
AnimatePadding：10，
hovercolor：黑
}；
var选项=扩展（默认值，选项）；
返回this.each（函数（）{（）
选项；
在这种情况下，分配给变量的元素集是UL
var obj = $（this）；
在UL中获取一个对象
var项目= $（）
（悬停）将事件添加到
items.hover（函数（）{（）
美元（这个）。Css（颜色）
队列false表示未添加到动画队列中。
$（这）。动画（{ paddingleft：o.animatepadding }，{队列：假，持续时间：300 }）；
}函数（）{（）
美元（这个）。Css（颜色）
$（这）。动画（{ paddingleft：0 }，{队列：真的，持续时间：300 }）；
}）；
}）；
}
}）；
}（jQuery）；
当然，在外部链插件之前需要使用SRC的原始jQuery库文件：
复制代码代码如下所示：
$（文档）Ready（函数（）{）
$（# catary）。PaddingList（{ animatepadding：30，hovercolor：红色}）；
}）；