前言
图片滚动效果相信对大家来说都不陌生，烂大街的效果图如下所示，js实现代码很短，不过如果想做的话，必须掌握jquery、IIFE、setInterval等基础以及$.fn用法：
jquery中$.fn用法
$.fn是jquery的命名空间,如果对jquery源码有过学习，就不难发现源码中有如下代码：
jquery.fn=jquery.prototype={ init:function(selector,context){ /* *code */ }}所以说jquery.fn也就是jquery.prototype的简写。我们的源码调用的构造函数jquery（）实例实际是jquery.fn.init（）的实例。
代码如下：
jQuery = function( selector, context ) { //jqeruy内部使用new创建返回另一个构造函数实力是为了省去调用jquery时前面的new，并在后面定义了别名$; //构造函数jquery()调用的是构造函数jQuery.fn.init()的实例 return new jQuery.fn.init( selector, context );},/*code*/之后后续代码有执行了jquery.fn.init.prototype=jquery.fn，用构造函数jquery的原型对象覆盖jquery.fn.init()的原型对象，使得jquery.fn.init实例也能访问到jquery()的原型方法和属性。
开发插件的方法：用$.fn扩展jquery生成新的方法。
1、可以使用jquery.extend(object)扩展jquery类本身，为类添加新的方法。
2、用jquery.fn.extend(object)给jquery对象添加方法。
下面用jquery.extend(object)扩展jquery类,添加类方法：
$.extent({ add: function(a,b){ return a+b; }})以后就可以直接使用$.add(1,2);//3
下面用jquery.fn.extend(object)对jquery.prototype扩展一个方法。
$.fn.extend({ [函数名]：fucntion(){ /*code*/ }});以后可以直接使用$(“div”).函数名()。
使用jquery中的$.fn封装一个图片滚动插件 这是一个使用到烂大街的一个插件了，不用说也知道是什么。不过具体是怎么实现的，继续往下看。这个插件最主要的部分也就是js的实现，html和css很简单，不赘述。如果下面一些知识点已经熟悉，可以选择性跳过。setInterval()
setInterval()可以按指定时间不停的调用函数，直到调用clearInterval或者关闭窗口。setInterval(fucntion(){/*code*
