Случайная непрозрачность анимации в списке элементов

Question

Случайная непрозрачность анимации в списке элементов

0

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

Ссылка: http://theintegrateur.com/grid.jpg

То, что я хочу сделать, это анимация в диапазоне ".clients-overlay", так что, когда страница загружает случайный элемент, наложение имеет непрозрачность 0 в течение 4 секунд, а затем возвращается к 0.7. Затем одна и та же анимация происходит со случайным элементом в списке.

    <ul id="clients-list" class="group">
        <li>
            <span class="clients-overlay">&nbsp;</span>
            <span><img src="img/logo-client.jpg" alt="Client" title="Client" /></span>
        </li>
        <li>
            <span class="clients-overlay">&nbsp;</span>
            <span><img src="img/logo-client.jpg" alt="Client" title="Client" /></span>
        </li>
        <li>
            <span class="clients-overlay">&nbsp;</span>
            <span><img src="img/logo-client.jpg" alt="Client" title="Client" /></span>
        </li>
        <li>
            <span class="clients-overlay">&nbsp;</span>
            <span><img src="img/logo-client.jpg" alt="Client" title="Client" /></span>
        </li>
    </ul>

user2150463 20 сен. 2013, в 20:38

Источник

Теги:

jquery

css3

animation

opacity

1 ответ

Ещё вопросы

Zach Saucier · Accepted Answer · 2013-09-20T16-19-00.000Z

Редактировать для циклической работы функции

Обновленная демоверсия

Чтобы закодировать его, вы можете просто поместить его в функцию и вызвать ее, например

function changeOverlay () {
    var randomNum = Math.round(Math.random() * 4) - 1;
    $('.clients-overlay:eq(' + randomNum + ')').animate({ "opacity" : .4 });
    setTimeout(function() { 
        $('.clients-overlay:eq(' + randomNum + ')').animate({ "opacity" : .7 });
        changeOverlay();
    }, 4000);
}

$(document).ready(function() {
    changeOverlay();
});

Привет, большое спасибо за ответ. Похоже, он работает только для одного элемента. По сути, когда первый случайный элемент имеет непрозрачность до 0,7, я хочу, чтобы анимация применялась к другому случайному элементу в цикле. :)
Я надеюсь, что это удовлетворяет ваши потребности. Дайте мне знать, если вам нужна чистая версия javascript, вам не нужен jQuery, если это единственное, что вы используете для
Вау, это именно то, что я искал, и это работает как шарм. Вы принимаете денежный вклад? :)
Ха-ха, это далеко не обязательно. Здесь, в StackOverflow, мы стремимся помочь пользователям, не получая ничего, кроме гордости за помощь. Если вы хотите нанять меня, свяжитесь со мной по адресу [email protected] или посетите мой личный сайт
Хаха, если мне понадобятся твои услуги, я обязательно свяжусь с тобой в ближайшее время. Удачных вам выходных!