在ResponsiveSlides.js中随机化转换速度

时间:2015-02-18 03:43:26

标签: jquery responsive-slides

我在我的投资组合网站上添加了一系列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 个答案:

没有答案