Произведите рандомизацию скорости перехода в ResponsiveSlides.js

Я добавляю серию ResponsiveSlides на свой сайт портфолио, и я бы хотел, чтобы они рандомизировали скорость своего перехода, чтобы каждый слайд постепенно переходил к следующему через разные промежутки времени. Я могу изменить скорость на любой фиксированный интервал, но я не знаю, как ее рандомизировать. Вот этот сайт: jcwebandgraphic.com

И вот мой код:

SCRIPT

<script>
    // Slider Functions
    $(function() {
        $('.rslides').responsiveSlides({
            speed: 1000,
            timeout: 3000
        });
    })
</script>

HTML

<div id='slider'>
                <ul class='rslides'>
                    <li><a href='audioinformationradio.com'><img src='images/air.jpg' alt='Professional Project: Audio Information Radio'></a></li>

                    <li><a href='danachapmanmassage.com'><img src='images/dana.jpg' alt='Professional Project: Dana Chapman Massage'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/zavaah/'><img src='images/zavaah.jpg' alt='Student Project: Zava&apos;ah, An Ethical Will'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/howto/'><img src='images/crash.jpg' alt='Student Project: A Crash Course in Chemistry'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/tools-for-ethical-decision-making/'><img src='images/ethics.jpg' alt='Student Project: Tools for Ethical Dilemmas'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/placestory/'><img src='images/placestory.jpg' alt='Student Project: This is Me'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/blackbird/'><img src='images/bird.jpg' alt='Student Project: 13 Ways of Looking at a Blackbird'></a></li>
                </ul>
            </div>
            <div id='slider'>
                <ul class='rslides'>
                    <li><a href='danachapmanmassage.com'><img src='images/dana.jpg' alt='Professional Project: Dana Chapman Massage'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/zavaah/'><img src='images/zavaah.jpg' alt='Student Project: Zava&apos;ah, An Ethical Will'></a>
                    </li>

                    <li><a href='http://dtc-wsuv.org/jcohen/howto/'><img src='images/crash.jpg' alt='Student Project: A Crash Course in Chemistry'></a>
                    </li>

                    <li><a href='http://dtc-wsuv.org/jcohen/tools-for-ethical-decision-making/'><img src='images/ethics.jpg' alt='Student Project: Tools for Ethical Dilemmas'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/placestory/'><img src='images/placestory.jpg' alt='Student Project: This is Me'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/blackbird/'><img src='images/bird.jpg' alt='Student Project: 13 Ways of Looking at a Blackbird'></a>
                    </li>

                    <li><a href='audioinformationradio.com'><img src='images/air.jpg' alt='Professional Project: Audio Information Radio'></a></li>
                </ul>
            </div>
            <div id='slider'>
                <ul class='rslides'>
                    <li><a href='http://dtc-wsuv.org/jcohen/zavaah/'><img src='images/zavaah.jpg' alt='Student Project: Zava&apos;ah, An Ethical Will'></a>
                    </li>

                    <li><a href='http://dtc-wsuv.org/jcohen/howto/'><img src='images/crash.jpg' alt='Student Project: A Crash Course in Chemistry'></a>
                    </li>

                    <li><a href='http://dtc-wsuv.org/jcohen/tools-for-ethical-decision-making/'><img src='images/ethics.jpg' alt='Student Project: Tools for Ethical Dilemmas'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/placestory/'><img src='images/placestory.jpg' alt='Student Project: This is Me'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/blackbird/'><img src='images/bird.jpg' alt='Student Project: 13 Ways of Looking at a Blackbird'></a></li>

                    <li><a href='audioinformationradio.com'><img src='images/air.jpg' alt='Professional Project: Audio Information Radio'></a></li>

                    <li><a href='danachapmanmassage.com'><img src='images/dana.jpg' alt='Professional Project: Dana Chapman Massage'></a></li>
                </ul>
            </div>
            <div id='slider'>
                <ul class='rslides'>
                    <li><a href='http://dtc-wsuv.org/jcohen/howto/'><img src='images/crash.jpg' alt='Student Project: A Crash Course in Chemistry'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/tools-for-ethical-decision-making/'><img src='images/ethics.jpg' alt='Student Project: Tools for Ethical Dilemmas'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/placestory/'><img src='images/placestory.jpg' alt='Student Project: This is Me'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/blackbird/'><img src='images/bird.jpg' alt='Student Project: 13 Ways of Looking at a Blackbird'></a></li>

                    <li><a href='audioinformationradio.com'><img src='images/air.jpg' alt='Professional Project: Audio Information Radio'></a></li>

                    <li><a href='danachapmanmassage.com'><img src='images/dana.jpg' alt='Professional Project: Dana Chapman Massage'></a></li>

                    <li><a href='http://dtc-wsuv.org/jcohen/zavaah/'><img src='images/zavaah.jpg' alt='Student Project: Zava&apos;ah, An Ethical Will'></a>
                    </li>
                </ul>
                <img id='frame' src='images/logo-1000.png'>
            </div>

CSS

#slider {
    width: 50%;
    float: left;
    }

.rslides {
    width: 100%;
    list-style: none;
    overflow: hidden;
    z-index: 5;
    }

.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    list-style-type: none;
    }

.rslides img {
    width: 100%;
    display: block;
    float: left;
    z-index: 1;
    }

#frame {
    width: 30%;
    margin: 10% 35%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    }

#frame img {
    width: 100%;
    }

0 ответов

Другие вопросы по тегам