无法阻止JSSOR在Hover上暂停
无法阻止JSSOR在Hover上暂停
提问于 2015-06-27 15:22:44
我试图阻止JSSOR暂停悬停。我已经检查过以前的问答，但这些都是关于让它盘旋，而不是阻止它！
我认为我已经获得了所有正确的JSSOR设置，甚至试图为Slider解除鼠标器和mouseleave的绑定，但似乎没有任何东西有效。这意味着，如果鼠标在大滑块容器上，那么它将停止自动播放。我要自动播放不间断地继续播放。
以下是相关代码：
//Define an array of slideshow transition code
var _SlideshowTransitions = [
{ $Duration: 1200, $SlideOut: true, $FlyDirection: 2, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Opacity: $JssorEasing$.$EaseLinear }, $ScaleHorizontal: 0.3, $Opacity: 2 }
];
var options = {
$SlideDuration: 500, //[Optional] Specifies default duration (swipe) for slide in milliseconds, default value is 500
$DragOrientation: 1, //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
$AutoPlay: true, //[Optional] Whether to auto play, to enable slideshow, this option must be set to true, default value is false
$AutoPlayInterval: 2000, //[Optional] Interval (in milliseconds) to go for next slide since the previous stopped if the slider is auto playing, default value is 3000
$HoverToPause: false, //Whether to pause when mouse over if a slideshow is auto playing
$SlideshowOptions: { //[Optional] Options to specify and enable slideshow or not
$Class: $JssorSlideshowRunner$, //[Required] Class to create instance of slideshow
$Transitions: _SlideshowTransitions, //[Required] An array of slideshow transitions to play slideshow
$TransitionsOrder: 0, //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
$PlayOrientation: 1, //[Optional] Direction of play, 1 horizontal, 2 vertical
$PauseOnHover: 0, //[Optional] Direction 0: no pause, 1: pause for desktop, 2: pause for touch device, 3: pause for
// desktop and touch device, 4: freeze for desktop, 8: freeze for touch device,
// 12: freeze for desktop and touch device, default value is 1
$ShowLink: false //[Optional] Whether to bring slide link on top of the slider when slideshow is running, default value is false
}
};
var jssor_slider1 = new $JssorSlider$('SliderContainer', options);下面是有问题的HTML元素：
<div id="SliderContainer" class="Slider">
<div u="slides" class="SlideContainer">
<div><img u="image" src="img/large-blinds/01-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/06-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/02-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/03-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/07-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/04-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
<div><img u="image" src="img/large-blinds/05-compressed.jpg" alt="" />
<div class="SlideTextContainer">
<div class="SlideText">Some Text</div>
</div>
</div>
</div>
</div>我很感谢你能对此做出任何修正才能让它发挥作用。
回答 3
Stack Overflow用户
发布于 2015-06-27 15:44:25
下面是JSSOR的API详细信息。
$PauseOnHover: 0,
//[Optional] Whether to pause when mouse over if a slider is auto playing,
0 no pause,
1 pause for desktop,
2 pause for touch device,
3 pause for desktop and touch device, default value is 3按要求使用
本质上是为了得到答案
$PauseOnHover: 0, Stack Overflow用户
发布于 2015-06-30 09:25:07
我已经解决了这个问题。
问题是在$SlideshowOptions中定义了$PauseOnHover (参见我最初问题中的原始JSSOR代码)。
为了让这件事起作用，我不得不把它放在$SlideshowOptions之外
//Define an array of slideshow transition code
var SlideshowTransitions = [
{ $Duration: 1200, $SlideOut: true, $FlyDirection: 2, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Opacity: $JssorEasing$.$EaseLinear }, $ScaleHorizontal: 0.3, $Opacity: 2 }
];
var options = {
$SlideDuration: 1500, //[Optional] Specifies default duration (swipe) for slide in milliseconds, default value is 500
$DragOrientation: 1, //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
$AutoPlay: true, //[Optional] Whether to auto play, to enable slideshow, this option must be set to true, default value is false
$AutoPlayInterval: 2000, //[Optional] Interval (in milliseconds) to go for next slide since the previous stopped if the slider is auto playing, default value is 3000
$PauseOnHover: 0, //[Optional] Direction 0: no pause, 1: pause for desktop, 2: pause for touch device, 3: pause for
$TransitionsOrder: 0, //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
$PlayOrientation: 1, //[Optional] Direction of play, 1 horizontal, 2 vertical
// desktop and touch device, 4: freeze for desktop, 8: freeze for touch device,
// 12: freeze for desktop and touch device, default value is 1
$ShowLink: true, //[Optional] Whether to bring slide link on top of the slider when slideshow is running, default value is false
$SlideshowOptions:
{ //[Optional] Options to specify and enable slideshow or not
$Class: $JssorSlideshowRunner$, //[Required] Class to create instance of slideshow
$Transitions: SlideshowTransitions, //[Required] An array of slideshow transitions to play slideshow
}
};
var jssor_slider1 = new $JssorSlider$('SliderContainer', options);默认操作是在悬停时暂停，因此变量的不正确放置意味着它使用了默认操作。
幻灯片放映现在正常工作，不再暂停悬停。
我希望这对使用JSSOR的其他人是有用的，这是一个非常有用和多功能的幻灯片工具。
Stack Overflow用户
发布于 2017-08-11 10:06:34
您可以设置，$PauseOnHover: 3代替$PauseOnHover: 0
$PauseOnHover: 3页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/31090292
复制相关文章
相似问题
腾讯云开发者
