0


所以这是我上一个问题的第 2 部分(建议为此提出一个新问题)。
我以前的帖子仅供参考:div 中的儿童点。一个 jQuery 头痛

我现在的问题是:
如何将“活动”类/ID 添加到“imgdots”div 以进行样式设置?
例如:
假设我在图像 4 上,那么我希望第 4 个“imgdots”div 是另一种颜色。

再次,任何帮助将不胜感激!

编辑
我已经设置了一个包含我迄今为止所拥有的小提琴。最初的图像滑块来自我遵循的教程,并从那里拼凑起来。
这是链接:jsfiddle.net/Reinhardt/cgt5M/8/

4

2 回答 2

1

你见过第n个孩子的css吗?

http://www.w3schools.com/cssref/sel_nth-child.asp

#showContainer:nth-child(4)
{
background:#ff0000;
}
于 2013-10-10T08:01:13.993 回答
0

尝试

/* The jQuery plugin */
(function ($) {
    $.fn.simpleShow = function (settings) {
        var config = {
            'tranTimer': 5000,
            'tranSpeed': 'normal'
        };
        if (settings) $.extend(config, settings);
        this.each(function () {
            var $wrapper = $(this),
                $ct = $wrapper.find('.showContainer'),
                $views = $ct.children();
            var viewCount = $views.length;

            var $imgdotholder = $('<div class="imgdotholder"></div>').appendTo('.wrapper');
            for (var i = 0; i < viewCount; i++) {
                $('<div class="imgdots"></div>').appendTo($imgdotholder);
            }
            var $imgdots = $imgdotholder.children();

            var timer, current = 0;

            function loop() {
                timer = setInterval(next, config.tranTimer);
            }

            function next(idx) {
                $views.eq(current).hide();

                current = idx == undefined ? current + 1 : idx;
                if (isNaN(current) || current < 0 || current >= viewCount) {
                    current = 0;
                }

                $views.eq(current).fadeIn(config.tranSpeed);
                $imgdots.removeClass('current').eq(current).addClass('current');
            }

            $imgdots.click(function(){
                clearInterval(timer);
                next($(this).index());
            })

            $wrapper.find('.btn_nxt').click(function(){
                clearInterval(timer);
                next();
            });
            $ct.hover(function(){
                clearInterval(timer);
            }, loop);

            $views.slice(1).hide();
            $imgdots.eq(0).addClass('current');
            loop();
        });
        return this;
    };
})(jQuery);

/* Calling The jQuery plugin */
$(document).ready(function () {
    /**/
    $(".wrapper").simpleShow({
        'tranTimer': 3000,
        'tranSpeed': 800
    });
});

演示:小提琴

于 2013-10-11T07:08:49.717 回答