2014-04-17 97 views
1

我一直在搜索,无法找到任何帮助我的东西。Flexislider在第一张幻灯片和最后一张幻灯片上删除导航箭头

我正在使用Flexislider并尝试删除第一张幻灯片上的上一个链接和上一张幻灯片上的下一个链接。

我甚至把我的第一张幻灯片和最后一张幻灯片封装在一个div中,以将它们与其他幻灯片分开。

继承人我的网站:http://www.thisiseloise.co.uk/Mobile/

这里是我的代码自动取款机,但它不工作:

$('#first').flexslider({ 
    start: function(){ 
    var active_rel = $(this).find('.flex-direction-nav .flex-prev').css('display:none'); 
    }, 

    }); 

    $('#last').flexslider({ 
    end: function(){ 
    var active_rel = $(this).find('.flex-direction-nav .flex-prev').css('display:none'); 
    }, 

    }); 

任何帮助,将不胜感激:)

感谢

+0

一些生动的例子将不胜感激:)它有助于如果你方便社区 – EricG

+0

对不起,我想我把它放在! :p 继承人我的网站与滑块[链接](http://www.thisiseloise.co.uk/Mobile/) – user3423339

回答

0

你应该尝试此机制:

$('.flexslider').flexslider({ 
    animation: 'fade', 
    controlsContainer: '.flexslider', 
    start: function() { 
     // 
    }, 
    end: function() { 
    // 
    } 
}); 

对不起,以下文本,我忘了看你的代码>。 <(你已经有了什么)


快速的GoogleSearch导致我这个网站:FlexSlider API

在这里,你可以看到你可以连接到:

属性,默认值,说明

  1. start .....当滑块加载第一张幻灯片时触发。
  2. end ......当滑块到达最后一个滑块时触发(异步)。
  3. before..Fires异步与每个滑块动画。

那么你可以做的是一样的东西:

$('.flexslider').flexslider({ 
    animation: 'fade', 
    controlsContainer: '.flexslider' 
}).before(function() { 
    // Reset before each slide (cheap operation so it's no biggie to call everytime) 
    $(".flex-direction-nav").removeClass("firstActive lastActive"); 
}).start(function() { 
    // 
    $(".flex-direction-nav").addClass("firstActive"); 
}).end(function() { 
    // 
    $(".flex-direction-nav").addClass("lastActive"); 
}); 

和CSS:

.flex-direction-nav.firstActive, .flex-direction-nav.lastActive { 
    opacity: 0; // You can think about how to hide it, with transition or sth. 
} 

我会进一步建议是使用的ID(可能代替班 - 或两者) ,这是一个很好的做法。

相关问题