旋转滑块停止并单击开始

时间:2014-01-06 14:32:32

标签: jquery slider

我在我的网站上使用jQuery革命滑块。我想在 点击 停止 开始 滑块>。我怎么能这样做。

$('.rev-slider-banner-full').revolution({
    delay: 7000,
    startwidth: 960,
    startheight: 600,
    onHoverStop: "off",
    thumbWidth: 100,
    thumbHeight: 50,
    thumbAmount: 3,
    hideThumbs: 0,
    navigationType: "none",
    navigationArrows: "solo",
    navigationStyle: "bullets",
    navigationHAlign: "center",
    navigationVAlign: "bottom",
    navigationHOffset: 30,
    navigationVOffset: 30,
    soloArrowLeftHalign: "left",
    soloArrowLeftValign: "center",
    soloArrowLeftHOffset: 20,
    soloArrowLeftVOffset: 0,
    soloArrowRightHalign: "right",
    soloArrowRightValign: "center",
    soloArrowRightHOffset: 20,
    soloArrowRightVOffset: 0,
    touchenabled: "on",
    stopAtSlide: -1,
    stopAfterLoops: -1,
    hideCaptionAtLimit: 0,
    hideAllCaptionAtLilmit: 0,
    hideSliderAtLimit: 0,
    fullWidth: "on",
    fullScreen: "off",
    fullScreenOffsetContainer: "#topheader-to-offset",
    shadow: 0
});

1 个答案:

答案 0 :(得分:8)

This (rather brief) API page解释了您可以使用Revolution Slider的功能,例如revpause()revresume()

因此,如果您想在单击按钮时停止滑块,则需要在页面的某个位置放置按钮(或链接标记)。实施例...

<button id="stopButton">Stop</button>
<button id="resumeButton">Resume</button>

然后使用以下jQuery ...

// When stop button is clicked...
$('#stopButton').on('click', function(e){ 
    $('.rev-slider-banner-full').revpause();
});

// When resume button is clicked...
$('#resumeButton').on('click', function(e){ 
    $('.rev-slider-banner-full').revresume();
});

如果滑块元素的类别或ID不同,请将.rev-slider-banner-full替换为<{p}}。