Отслеживать на активный слайд


Я использую класс "активный", чтобы отслеживать, на которой ребенок исчезать и исчезать в моей галерее. Есть ли другие, лучшие варианты для этого?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#div_with_children{margin:0 auto;width:960px;height:499px;overflow:hidden}
.child{width:960px;height:500px}
</style>
</head>
<body>
<div id="div_with_children">
<div class="child" style="background:#0C3">1</div>
<div class="child" style="background:#993">2</div>
<div class="child" style="background:#F63">3</div>
<div class="child" style="background:#FC0">4</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
(function ($) {
    $.fn.bildspel_fade = function () {
        var $t = this,
            $c = $t.children(),
            $c0 = $c.eq(0),
            $c1 = $c.eq(-1),
            n = function () {
                var i = $t.children('.active').index(),
                    i1 = i + 1;
                $c.css('position', 'absolute');
                if ($c1.hasClass("active")) { // om man ÄR på sista
                    $c1.fadeOut(1000).removeClass('active');
                    $c0.addClass('active').fadeIn(1000);
                }
                else { // om man INTE ÄR på sista
                    $t.find('.active').fadeOut(1000).removeClass('active').next().addClass('active').fadeIn(1000);
                }
            };
        setInterval(n, 6000);
        $c.hide();
        $c0.addClass('active').fadeIn(1000);
    };
})(jQuery);
$(window).load(function () {
    $('#div_with_children').bildspel_fade();
});
</script>
</body>
</html>


488
2
задан 21 декабря 2011 в 02:12 Источник Поделиться
Комментарии
1 ответ

Может быть, с помощью jQuery это $.данных() для хранения переменной типа bool или что-то подобное.

Также можно хранить глобальную переменную с активной позицией (например, "3" за 3-й пункт в галерее), а затем изменить его, используя его вместе с :экв() селектор.

В любом случае, я думаю, что .активный классовый подход является весьма полезным, поскольку это дает вам шанс изменить свойства CSS для этого конкретного товара на вашу галерею.

1
ответ дан 21 декабря 2011 в 06:12 Источник Поделиться