Fotorama 4禁用箭头

Question

我需要有关fotorama 4的帮助。我想禁用导航箭头

data-arrow="false" data-arrows="false" $('#my-fotorama').fotorama({arrows: 'false'}); $('#my-fotorama').fotorama({arrows: 'null'});不工作。

Answer 1

首先，你应该下载未压缩的版本，然后，添加一些更改...

我添加了一个选项：

 arrows: true // default option, could be false, too =>2636. line of code...

并且，setOptions函数中有一些小的变化：

function setOptions () {
    o_fade = opts.transition === 'crossfade' || opts.transition === 'dissolve';

    o_loop = opts.loop && (size > 2 || o_fade);

    var classes = {add: [], remove: []};

    if (size > 1) {
      o_nav = opts.nav;
      o_navTop = opts.navPosition === 'top';
      classes.remove.push(selectClass);
if(opts.arrows) {
      $arrs.show();
}

else {
     $arrs.hide();
}
      arrsUpdate();
    } else {
      o_nav = false;

      $arrs.hide();
    }

现在您可以直接在html中设置箭头选项(显示/隐藏)，如下所示：

<div class="fotorama" data-arrows="false">

完整的更新代码：http://pastebin.com/zg4yJCCb

Answer 2

如果你使用最新的版本(目前是Fotorama 4.5.2 )，现在有一个内置的选项：

箭头- true / false / 'always‘

$(".fotorama").fotorama({ arrows: false });

Answer 3

嗯..。我推荐一种CSS方法：

.fotorama__arr {
  display: none !important;
}

将其添加到您的样式中，而不是fotorama.css中。

此外，我也不建议更改fotorama.js。但是，当然，如果你不关心将来的升级，你可以做到这一点。