更改 onhover 图像而不是 onclick jssor 滑块答案

【问题标题】：Change onhover image instead of onclick jssor slider更改 onhover 图像而不是 onclick jssor 滑块
【发布时间】：2014-09-11 12:03:03
【问题描述】：

我正在使用这个滑块 http://www.jssor.com/demos/list-slider.html

我想改变 onhover 缩略图而不是 onclick thumbnail，

【问题讨论】：

标签： jquery html slider jssor

【解决方案1】：

如果您已下载演示，则可以选择更改缩略图的悬停。

只需添加

$ActionMode : 2

到

$ThumbnailNavigatorOptions: {
}

它适用于缩略图悬停图像。享受吧。

【讨论】：

【解决方案2】：

来自this 源文件，

if (_Options.$ActionMode & 1) $JssorUtils$.$AddEvent(_Wrapper, "click", OnNavigationRequest);
if (_Options.$ActionMode & 2) $JssorUtils$.$AddEvent(_Wrapper, "mouseover", OnNavigationRequest);

基于$ActionMode的事件触发。

解决方案：

您需要设置选项$ActionMode : 2 以使其与鼠标悬停事件一起使用。默认情况下他们设置$ActionMode : 1。

在$ThumbnailNavigatorOptions: {} 中设置$ActionMode : 2。以下代码来自list slider的演示文件

$ThumbnailNavigatorOptions: {
    $Class: $JssorThumbnailNavigator$, //[Required] Class to create thumbnail navigator instance
    $ChanceToShow: 2, //[Required] 0 Never, 1 Mouse Over, 2 Always

    $Loop: 2, //[Optional] Enable loop(circular) of carousel or not, 0: stop, 1: loop, 2 rewind, default value is 1
    $AutoCenter: 3, //[Optional] Auto center thumbnail items in the thumbnail navigator container, 0 None, 1 Horizontal, 2 Vertical, 3 Both, default value is 3
    $Lanes: 1, //[Optional] Specify lanes to arrange thumbnails, default value is 1
    $SpacingX: 4, //[Optional] Horizontal space between each thumbnail in pixel, default value is 0
    $SpacingY: 4, //[Optional] Vertical space between each thumbnail in pixel, default value is 0
    $Cols: 4, //[Optional] Number of pieces to display, default value is 1
    $Align: 0, //[Optional] The offset position to park thumbnail
    $Orientation: 2, //[Optional] Orientation to arrange thumbnails, 1 horizental, 2 vertical, default value is 1
    $DisableDrag: false, //[Optional] Disable drag or not, default value is false
    $ActionMode: 2
}

见最后一行$ActionMode:2。 $ActionMode 在这里扮演角色。如果将此设置为1，它将在click 事件上触发。如果你设置2，事件会在mouseover触发。

【讨论】：