Разделительный индекс дочерних элементов в JavaScript jQuery ⇐ Jquery

[Anonymous]

Код: Выделить всё

// JavaScript Document
$(document).ready(function() {
var num = $(".font-main-image").children("img").length;
$("body .font-main-image").children("img").eq(0).show();
var j = num;
var i = 0;

function main() {
function toggle() {
$("body .font-main-image").children("img").eq(i - 1).hide();
$("body .font-main-image").children("img").eq(i).show();
i = i + 1;
if (i === num) {
clearInterval(int);
int1 = setInterval(toggleback, 90);
}
}
var int = setInterval(toggle, 90);

function toggleback() {
$("body .font-main-image").children("img").eq(j - 1).hide();
$("body .font-main-image").children("img").eq(j - 2).show();
j = j - 1;
if (j === 1) {
clearInterval(int1);
j = num;
i = 0;
}
}
}
setInterval(main, 90 * 2 * num);
});

Код: Выделить всё

img {
display: none;
position: absolute;
width: 400px;
}

Код: Выделить всё

[img]Ravi-01.svg[/img]
[img]Ravi-02.svg[/img]
[img]Ravi-03.svg[/img]
[img]Ravi-04.svg[/img]
[img]Ravi-05.svg[/img]
[img]Ravi-06.svg[/img]
[img]Ravi-07.svg[/img]
[img]Ravi-08.svg[/img]

[img]Ravi-01.svg[/img]
[img]Ravi-02.svg[/img]
[img]Ravi-03.svg[/img]
[img]Ravi-04.svg[/img]
[img]Ravi-05.svg[/img]
[img]Ravi-06.svg[/img]
[img]Ravi-07.svg[/img]
[img]Ravi-08.svg[/img]

У меня есть несколько элементов div с одинаковыми классами и внутри них несколько элементов img с одинаковыми классами с display: none в моем CSS, и я хочу переключаться между дочерними элементами (элементами img с одним и тем же классом) от первого к последнему, а затем от последнего к первому, и иметь только один display:block за раз, поэтому это будет своего рода анимация.
Обратите внимание, что их немного. элементы div с одним и тем же классом, и элементы img внутри них также имеют один и тот же класс, и я хочу просмотреть каждый элемент div отдельно.

Подробнее здесь: https://stackoverflow.com/questions/458 ... ipt-jquery