开发者社区> 问答> 正文

jQuery 自制图片展示小插件求建议

a123456678 2016-03-11 10:26:38 807

自制的jQuery小插件,希望各路大神看看javascript,css代码有哪些需要修改或提高的地方

我自知代码写得不够好,不要见笑!

JavaScript 前端开发
分享到
取消 提交回答
全部回答(1)
  • a123456678
    2019-07-17 18:58:35

    个人愚见,有一些可以优化的地方。

    setTimeout的使用
    在高级浏览器中,requestAnimationFrame效率更高,因此建议去了解一下这个方法的使用,兼容性写法如下:
    ;

    (function(ROOT, struct, undefined) {
    
        var lastTime = 0,
            nextFrame = ROOT.requestAnimationFrame       ||
                        ROOT.webkitRequestAnimationFrame ||
                        ROOT.mozRequestAnimationFrame    ||
                        ROOT.msRequestAnimationFrame     ||
                        function(callback) {
                            var currTime = + new Date,
                                delay = Math.max(1000/60, 1000/60 - (currTime - lastTime));
                            lastTime = currTime + delay;
                            return setTimeout(callback, delay);
                        },
            cancelFrame=ROOT.cancelAnimationFrame               ||
                        ROOT.webkitCancelAnimationFrame         ||
                        ROOT.webkitCancelRequestAnimationFrame  ||
                        ROOT.mozCancelRequestAnimationFrame     ||
                        ROOT.msCancelRequestAnimationFrame      ||
                        clearTimeout;
                        

    扩展jQuery插件的方式,建议不要直接使用jQuery的内部方法,因为这样太依赖jquery了,你可以使用原生方法开发出来,然后使用jquery的$.fn.extend让自己的插件变成jquery的插件。
    那么在以后的使用中,你就可以通过改变很小的地方,让自己的插件变成amd标准,在requirejs中使用,或者轻松转换为angular/react等的插件。

    大致写法如下,

    并不适用于你的插件,需要你自己下功夫多研究研究
    $.fn.extend({

    xxx:function(config){
        return new Carousel(this,config);
    }

    });
    运动算法的计算方式,建议去了解一下TWeen,
    drag方法还可以提炼优化,有点复制,不利于重复调用
    绑定事件的回调函数建议不要使用匿名函数

    0 0

集结各类场景实战经验,助你开发运维畅行无忧

推荐文章
相似问题
推荐课程