【问题标题】:How to make my flexslider hashtag compatible如何使我的 flexslider 标签兼容
【发布时间】:2013-02-09 22:57:55
【问题描述】:

有没有人可以分享 mypage.com/#slide1 或 mypage.com/#slide2 之类的链接 并调用我的滑块的特定幻灯片?

谢谢。

【问题讨论】:

标签: jquery hashtag flexslider


【解决方案1】:

我认为我有一个想法:

首先你需要创建一个带有导航控件的 flexslider

然后,使用名为 slide1、slide2、slideX 的井号标签,您知道您想要转到 (X-1) 元素,所以这里有一个示例:

(jQuery.noConflict())(function($) {
    //Get your hash tag
    var loc = $(location).attr('href');
    var idx = 1;
    if(loc.lastIndexOf('#') != -1)
    {
        idx = loc.substr(loc.lastIndexOf('#')+1).replace('slide', '');
    }

    //verify that idx is really a number
    if(isNaN(idx-0))
    {
        idx = 1;
    }

    //Click on your nav (idx starts at 0)
    $('.flex-control-nav li:eq('+(idx-1)+') a').trigger('click');
    });

另一种方法是像这样使用 startAt 参数:

(jQuery.noConflict())(function($) {
    //Get your hash tag
    var loc = $(location).attr('href');
    var idx = 1;
    if(loc.lastIndexOf('#') != -1)
    {
        idx = loc.substr(loc.lastIndexOf('#')+1).replace('slide', '');
    }

    //verify that idx is really a number
    if(isNaN(idx-0))
    {
        idx = 1;
    }

    $('#yourFlexSlider').flexslider ({
        startAt: idx
    });
});

【讨论】:

  • 嗨菲利普,我试图使用你的代码,但我不知道为什么它不起作用,这是我的链接。是否可以在网址上添加#Slide?谢谢你的帮助。 disennio.com/clientes/insigne
  • 当你创建滑块时,你可以使用这个:在你的 $('.galeria-videos').flexslider({ ... });添加 startAt: idx 选项。这应该在 URL 中指定的幻灯片上启动滑块。确保您使用小写的幻灯片,它区分大小写。
  • 谢谢伙计。我想根据 url 触发特定的幻灯片,例如,如果我输入 www.mypage.com/contact 它将以
  • 我已经尝试了一切都找不到解决方案开始。谢谢。
猜你喜欢
相关资源
最近更新 更多
热门标签