| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 1595 人关注过本帖
标题:一段关于焦点图的 JS 代码,请各位师傅指点
只看楼主 加入收藏
bustyle
Rank: 1
等 级:新手上路
帖 子:9
专家分:0
注 册:2013-9-8
结帖率:100%
收藏
已结贴  问题点数:30 回复次数:10 
一段关于焦点图的 JS 代码,请各位师傅指点
这段代码只要点击下一个或者上一个之后,就不会自动播放了,网上下来学习的,水平有限,修改不了,请各位师傅帮忙指点下,在此谢谢各位了!

只有30分了,改对了全给了

程序代码:
(function(a) {
    a.flexslider = function(c, b) {
        var d = c;
        d.init = function() {
            d.vars = a.extend({},
            a.flexslider.defaults, b);
            d.data("flexslider", true);
            d.container = a(".slides", d);
            d.slides = a(".slides > li", d);
            d.count = d.slides.length;
            d.animating = false;
            d.currentSlide = d.vars.slideToStart;
            d.atEnd = (d.currentSlide == 0) ? true: false;
            d.eventType = ("ontouchstart" in document.documentElement) ? "touchstart": "click";
            d.cloneCount = 0;
            d.cloneOffset = 0;
            if (d.vars.controlsContainer != "") {
                d.controlsContainer = a(d.vars.controlsContainer).eq(a(".slides").index(d.container));
                d.containerExists = d.controlsContainer.length > 0
            }
            if (d.vars.manualControls != "") {
                d.manualControls = a(d.vars.manualControls, ((d.containerExists) ? d.controlsContainer: d));
                d.manualExists = d.manualControls.length > 0
            }
            if (d.vars.randomize) {
                d.slides.sort(function() {
                    return (Math.round(Math.random()) - 0.5)
                });
                d.container.empty().append(d.slides)
            }
            if (d.vars.animation.toLowerCase() == "slide") {
                d.css({
                    overflow: "hidden"
                });
                if (d.vars.animationLoop) {
                    d.cloneCount = 2;
                    d.cloneOffset = 1;
                    d.container.append(d.slides.filter(":first").clone().addClass("clone")).prepend(d.slides.filter(":last").clone().addClass("clone"))
                }
                d.container.width(((d.count + d.cloneCount) * d.width()) + 2000);
                d.newSlides = a(".slides > li", d);
                setTimeout(function() {
                    d.newSlides.width(d.width()).css({
                        "float": "left"
                    }).show()
                },
                100);
                d.container.css({
                    marginLeft: ( - 1 * (d.currentSlide + d.cloneOffset)) * d.width() + "px"
                })
            } else {
                d.slides.css({
                    width: "100%",
                    "float": "left",
                    marginRight: "-100%"
                }).filter(":first").fadeIn(400,
                function() {})
            }
            if (d.vars.controlNav) {
                if (d.manualExists) {
                    d.controlNav = d.manualControls
                } else {
                    var g = a('<ol class="flex-control-nav"></ol>');
                    var k = 1;
                    for (var l = 0; l < d.count; l++) {
                        g.append("<li><a>" + k + "</a></li>");
                        k++
                    }
                    if (d.containerExists) {
                        a(d.controlsContainer).append(g);
                        d.controlNav = a(".flex-control-nav li a", d.controlsContainer)
                    } else {
                        d.append(g);
                        d.controlNav = a(".flex-control-nav li a", d)
                    }
                }
                d.controlNav.eq(d.currentSlide).addClass("active");
                d.controlNav.bind(d.eventType,
                function(i) {
                    i.preventDefault();
                    if (!a(this).hasClass("active")) {
                        d.flexAnimate(d.controlNav.index(a(this)), d.vars.pauseOnAction)
                    }
                })
            }
            if (d.vars.directionNav) {
                var f = a('<ul class="flex-direction-nav"><li><a class="prev" href="#">' + d.vars.prevText + '</a></li><li><a class="next" href="#">' + d.vars.nextText + "</a></li></ul>");
                if (d.containerExists) {
                    a(d.controlsContainer).append(f);
                    d.directionNav = a(".flex-direction-nav li a", d.controlsContainer)
                } else {
                    d.append(f);
                    d.directionNav = a(".flex-direction-nav li a", d)
                }
                if (!d.vars.animationLoop) {
                    if (d.currentSlide == 0) {
                        d.directionNav.filter(".prev").addClass("disabled")
                    } else {
                        if (d.currentSlide == d.count - 1) {
                            d.directionNav.filter(".next").addClass("disabled")
                        }
                    }
                }
                d.directionNav.bind(d.eventType,
                function(i) {
                    i.preventDefault();
                    var j = (a(this).hasClass("next")) ? d.getTarget("next") : d.getTarget("prev");
                    if (d.canAdvance(j)) {
                        d.flexAnimate(j, d.vars.pauseOnAction)
                    }
                })
            }
            if (d.vars.keyboardNav && a("ul.slides").length == 1) {
                a(document).keyup(function(i) {
                    if (d.animating) {
                        return
                    } else {
                        if (i.keyCode != 39 && i.keyCode != 37) {
                            return
                        } else {
                            if (i.keyCode == 39) {
                                var j = d.getTarget("next")
                            } else {
                                if (i.keyCode == 37) {
                                    var j = d.getTarget("prev")
                                }
                            }
                            if (d.canAdvance(j)) {
                                d.flexAnimate(j, d.vars.pauseOnAction)
                            }
                        }
                    }
                })
            }
            if (d.vars.slideshow) {
                if (d.vars.pauseOnHover && d.vars.slideshow) {
                    d.hover(function() {
                        d.pause()
                    },
                    function() {
                        d.resume()
                    })
                }
                d.animatedSlides = setInterval(d.animateSlides, d.vars.slideshowSpeed)
            }
            if (d.vars.pausePlay) {
                var e = a('<div class="flex-pauseplay"><span></span></div>');
                if (d.containerExists) {
                    d.controlsContainer.append(e);
                    d.pausePlay = a(".flex-pauseplay span", d.controlsContainer)
                } else {
                    d.append(e);
                    d.pausePlay = a(".flex-pauseplay li a", d)
                }
                var h = (d.vars.slideshow) ? "pause": "play";
                d.pausePlay.addClass(h).text(h);
                d.pausePlay.click(function(i) {
                    i.preventDefault(); (a(this).hasClass("pause")) ? d.pause() : d.resume()
                })
            }
            if (d.vars.touchSwipe && "ontouchstart" in document.documentElement) {
                d.each(function() {
                    var i, j = 20;
                    isMoving = false;
                    function o() {
                        this.removeEventListener("touchmove", m);
                        i = null;
                        isMoving = false
                    }
                    function m(s) {
                        if (isMoving) {
                            var p = s.touches[0].pageX,
                            q = i - p;
                            if (Math.abs(q) >= j) {
                                o();
                                var r = (q > 0) ? d.getTarget("next") : d.getTarget("prev");
                                if (d.canAdvance(r)) {
                                    d.flexAnimate(r, d.vars.pauseOnAction)
                                }
                            }
                        }
                    }
                    function n(p) {
                        if (p.touches.length == 1) {
                            i = p.touches[0].pageX;
                            isMoving = true;
                            this.addEventListener("touchmove", m, false)
                        }
                    }
                    if ("ontouchstart" in document.documentElement) {
                        this.addEventListener("touchstart", n, false)
                    }
                })
            }
            if (d.vars.animation.toLowerCase() == "slide") {
                d.sliderTimer;
                a(window).resize(function() {
                    d.newSlides.width(d.width());
                    d.container.width(((d.count + d.cloneCount) * d.width()) + 2000);
                    clearTimeout(d.sliderTimer);
                    d.sliderTimer = setTimeout(function() {
                        d.flexAnimate(d.currentSlide)
                    },
                    300)
                })
            }
            d.vars.start(d)
        };
        d.flexAnimate = function(f, e) {
            if (!d.animating) {
                d.animating = true;
                if (e) {
                    d.pause()
                }
                if (d.vars.controlNav) {
                    d.controlNav.removeClass("active").eq(f).addClass("active")
                }
                d.atEnd = (f == 0 || f == d.count - 1) ? true: false;
                if (!d.vars.animationLoop) {
                    if (f == 0) {
                        d.directionNav.removeClass("disabled").filter(".prev").addClass("disabled")
                    } else {
                        if (f == d.count - 1) {
                            d.directionNav.removeClass("disabled").filter(".next").addClass("disabled");
                            d.pause();
                            d.vars.end(d)
                        } else {
                            d.directionNav.removeClass("disabled")
                        }
                    }
                }
                d.vars.before(d);
                if (d.vars.animation.toLowerCase() == "slide") {
                    if (d.currentSlide == 0 && f == d.count - 1 && d.vars.animationLoop) {
                        d.slideString = "0px"
                    } else {
                        if (d.currentSlide == d.count - 1 && f == 0 && d.vars.animationLoop) {
                            d.slideString = ( - 1 * (d.count + 1)) * d.slides.filter(":first").width() + "px"
                        } else {
                            d.slideString = ( - 1 * (f + d.cloneOffset)) * d.slides.filter(":first").width() + "px"
                        }
                    }
                    d.container.animate({
                        marginLeft: d.slideString
                    },
                    d.vars.animationDuration,
                    function() {
                        if (d.currentSlide == 0 && f == d.count - 1 && d.vars.animationLoop) {
                            d.container.css({
                                marginLeft: ( - 1 * d.count) * d.slides.filter(":first").width() + "px"
                            })
                        } else {
                            if (d.currentSlide == d.count - 1 && f == 0 && d.vars.animationLoop) {
                                d.container.css({
                                    marginLeft: -1 * d.slides.filter(":first").width() + "px"
                                })
                            }
                        }
                        d.animating = false;
                        d.currentSlide = f;
                        d.vars.after(d)
                    })
                } else {
                    d.slides.eq(d.currentSlide).fadeOut(d.vars.animationDuration);
                    d.slides.eq(f).fadeIn(d.vars.animationDuration,
                    function() {
                        d.animating = false;
                        d.currentSlide = f;
                        d.vars.after(d)
                    })
                }
            }
        };
        d.animateSlides = function() {
            if (!d.animating) {
                var e = (d.currentSlide == d.count - 1) ? 0 : d.currentSlide + 1;
                d.flexAnimate(e)
            }
        };
        d.pause = function() {
            clearInterval(d.animatedSlides);
            if (d.vars.pausePlay) {
                d.pausePlay.removeClass("pause").addClass("play").text("play")
            }
        };
        d.resume = function() {
            d.animatedSlides = setInterval(d.animateSlides, d.vars.slideshowSpeed);
            if (d.vars.pausePlay) {
                d.pausePlay.removeClass("play").addClass("pause").text("pause")
            }
        };
        d.canAdvance = function(e) {
            if (!d.vars.animationLoop && d.atEnd) {
                if (d.currentSlide == 0 && e == d.count - 1 && d.direction != "next") {
                    return false
                } else {
                    if (d.currentSlide == d.count - 1 && e == 0 && d.direction == "next") {
                        return false
                    } else {
                        return true
                    }
                }
            } else {
                return true
            }
        };
        d.getTarget = function(e) {
            d.direction = e;
            if (e == "next") {
                return (d.currentSlide == d.count - 1) ? 0 : d.currentSlide + 1
            } else {
                return (d.currentSlide == 0) ? d.count - 1 : d.currentSlide - 1
            }
        };
        d.init()
    };
    a.flexslider.defaults = {
        animation: "fade",
        slideshow: true,
        slideshowSpeed: 4000,
        animationDuration: 600,
        directionNav: true,
        controlNav: true,
        keyboardNav: true,
        touchSwipe: true,
        prevText: "Previous",
        nextText: "Next",
        pausePlay: false,
        randomize: false,
        slideToStart: 0,
        animationLoop: true,
        pauseOnAction: true,
        pauseOnHover: false,
        controlsContainer: "",
        manualControls: "",
        start: function() {},
        before: function() {},
        after: function() {},
        end: function() {}
    };
    a.fn.flexslider = function(b) {
        return this.each(function() {
            if (a(this).find(".slides li").length == 1) {
                a(this).find(".slides li").fadeIn(400)
            } else {
                if (a(this).data("flexslider") != true) {
                    new a.flexslider(a(this), b)
                }
            }
        })
    }
})(jQuery);


以下是嵌到html代码中的:
程序代码:
                $(window).load(function() {
                    $('.flexslider').flexslider()
                });
                $(document).ready(function() {
                    $('.flexslider').hover(function() {
                        $('.flex-direction-nav li a.prev').css('display', 'block');
                        $('.flex-direction-nav li a.next').css('display', 'block')
                    },
                    function() {
                        $('.flex-direction-nav li a.prev').css('display', 'none');
                        $('.flex-direction-nav li a.next').css('display', 'none')
                    })
                });
搜索更多相关主题的帖子: 自动播放 网上 
2014-05-14 09:31
诸葛修勤
Rank: 10Rank: 10Rank: 10
等 级:贵宾
威 望:11
帖 子:549
专家分:1955
注 册:2010-10-28
收藏
得分:0 
最好 将功能模块相关的文件打包  上传下   方便调试
2014-05-14 12:10
bustyle
Rank: 1
等 级:新手上路
帖 子:9
专家分:0
注 册:2013-9-8
收藏
得分:0 
回复 楼主 bustyle
jquery水平滑动tab选项卡.zip (151.05 KB)

这个是我下载来的完整代码,多谢指点!
2014-05-14 12:24
bustyle
Rank: 1
等 级:新手上路
帖 子:9
专家分:0
注 册:2013-9-8
收藏
得分:0 
回复 2 楼 诸葛修勤
jquery水平滑动tab选项卡.zip (151.05 KB)

这个是我下载的完整代码,多谢指点!
2014-05-14 12:25
bustyle
Rank: 1
等 级:新手上路
帖 子:9
专家分:0
注 册:2013-9-8
收藏
得分:0 
回复 3 楼 bustyle
传错了,是这个才对:
淡入淡出切换的jQuery焦点图.zip (567.96 KB)
2014-05-14 12:34
bustyle
Rank: 1
等 级:新手上路
帖 子:9
专家分:0
注 册:2013-9-8
收藏
得分:0 
回复 2 楼 诸葛修勤
传错了,是这个才对:
淡入淡出切换的jQuery焦点图.zip (567.96 KB)
2014-05-14 12:36
寒风中的细雨
Rank: 17Rank: 17Rank: 17Rank: 17Rank: 17
等 级:贵宾
威 望:66
帖 子:1710
专家分:8645
注 册:2009-9-15
收藏
得分:0 
插件就是这么设计的  相当于是暂停!


2014-05-15 01:19
寒风中的细雨
Rank: 17Rank: 17Rank: 17Rank: 17Rank: 17
等 级:贵宾
威 望:66
帖 子:1710
专家分:8645
注 册:2009-9-15
收藏
得分:0 
一般暂停操作都是  由于定时器被删掉了

这里删掉定时器的位置 只有这段代码存在
程序代码:
        d.pause = function() {
            clearInterval(d.animatedSlides);
            if (d.vars.pausePlay) {
                d.pausePlay.removeClass("pause").addClass("play").text("play")
            }
        };


2014-05-15 01:20
寒风中的细雨
Rank: 17Rank: 17Rank: 17Rank: 17Rank: 17
等 级:贵宾
威 望:66
帖 子:1710
专家分:8645
注 册:2009-9-15
收藏
得分:0 
找出引用它的地方

如果逻辑不熟悉   可以直接在引用的位置 下一个断点   
    Line 130:                         d.pause()
    Line 150:                     (a(this).hasClass("pause")) ? d.pause() : d.resume()
    Line 203:                     d.pause()
    Line 215:                             d.pause();

2014-05-15 01:22
寒风中的细雨
Rank: 17Rank: 17Rank: 17Rank: 17Rank: 17
等 级:贵宾
威 望:66
帖 子:1710
专家分:8645
注 册:2009-9-15
收藏
得分:30 
找出调用的位置   将代码注释掉就ok

程序代码:
        d.flexAnimate = function(f, e) {
            if (!d.animating) {
                d.animating = true;
                if (e) {
                    //d.pause()
                }

2014-05-15 01:24
快速回复:一段关于焦点图的 JS 代码,请各位师傅指点
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.026807 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved