链接到 jquery 滑块的特定幻灯片答案

【问题标题】：Link to a particular slide of a jquery slider链接到 jquery 滑块的特定幻灯片
【发布时间】：2011-05-06 10:22:40
【问题描述】：

所以我使用了一个非常基本的 jquery 滑块（请参阅this JSFiddle 上的示例）。我可以单击带有内容滑块的页面上的链接（“幻灯片 A”、“幻灯片 B”、“幻灯片 C”）以在幻灯片之间滑动。我希望喜欢能够做的是允许访问者从网站上的另一个页面点击“幻灯片 B”，该页面将链接到包含滑块的页面，然后显示幻灯片 B。

也许像这样的链接中的某种哈希标记或锚点可能会触发包含内容滑块的页面上的 Javascript 中的某些内容，以使幻灯片 B 出现：

<a href='slidepage.php#slide2>Slide B</a>

我使用的内容滑块脚本非常简单和小，所以我假设我可以在脚本中添加一些基本的东西来识别点击拉动幻灯片：

$(document).ready(function (){
$('#button a').click(function(){
    var integer = $(this).attr('rel');
    $('#myslide .cover').animate({left:-160*(parseInt(integer)-1)})  /*----- Width of div mystuff (here 160) ------ */
    $('#button a').each(function(){
    $(this).removeClass('active');
        if($(this).hasClass('button'+integer)){
            $(this).addClass('active')}
    });
});

});

再次，请参阅 JSFiddle in action here - 随意分叉并帮助一个人！

提前谢谢... 克里斯

【问题讨论】：

标签： javascript jquery slider

【解决方案1】：

$(document).ready(function (){
  ...
  your old code
  ...

  if(window.location.hash) {
    // Fragment exists
    var myhash = window.location.hash.substring(1);
    $("a[rel='" + myhash + "']").click();
  }
});

然后使用片段链接到幻灯片： http://yourhost.com/path/to/page.html#2

更新：在选择器中使用之前从片段中删除了#。

【讨论】：