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

发布于 2022-09-02 13:24:21 字数 180 浏览 12 评论 0

先贴上代码 github
小白自制的jQuery小插件,希望各路大神看看javascript,css代码有哪些需要修改或提高的地方
我自知代码写得不够好,不要见笑!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

你穿错了嫁妆 2022-09-09 13:24:21

大概看了一下,感觉还是很棒!

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

  • 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方法还可以提炼优化,有点复制,不利于重复调用

  • 绑定事件的回调函数建议不要使用匿名函数

千里故人稀 2022-09-09 13:24:21

挺好的,但是那个拖拽没理解怎么用?移动端怎么拖拽,拖拽什么位置啊?

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文