2013-05-13 74 views
0

好的,我已根据评论更新了我的代码,非常感谢。所以后退按钮现在正在工作,但是,它已经停止了我的内部链接,因为它们不再反映在URL中。以前我写的链接,所以在幻灯片编号填满:jquery循环插件:如何从幻灯片中链接并在网址中反映幻灯片号码

<a href="javascript:setSlide(1)"></a> 

这仍然是工作,但不改变URL喜欢它与malsup代码一样。我如何链接这两个代码位?我不是很有经验。

非常感谢

$(function() { 

// get current slide's number 
function currentSlide() { 
    var hash = window.location.hash || '#slide-1'; 
    return parseInt(hash.replace(/[A-Za-z#\-\/!]/g, '') - 1); 
} 
// global vars 
var cycleSelector = $('.images'), 
     startSlide = currentSlide(), 
     hasSlid = 0; 

// append some markup for the controls  
cycleSelector.before() 
// start jQuery Cycle 
.cycle({ 
    startingSlide: startSlide, 
    // when using the next/prev links 
onPrevNextEvent: function(isNext, idx, slide) { 
    hasSlid = 1; 
    window.location.hash = "slide-"+ (parseInt(idx) + 1) + ""; 
    return false; 
}, 
// when using the pager thumbnails 
onPagerEvent: function(idx, slide) { 
    hasSlid = 1; 
    window.location.hash = "slide-"+ (parseInt(idx) + 1) + ""; 
    return false; 
}, 
timeout: 0, 
pager: '#nav', 
next: '.next', 
prev: '.prev', 
slideResize: 0, 
containerResize: 0, 
speed: 500, 
before: onBefore, 
nowrap: 1, 
// build the thumbnails 
pagerAnchorBuilder: function(idx, slide) { 
    return '<a href="#"><p>' + $(slide).find('h1').html() + ' </p></a>'; 
} 
}); 


// bind to the hashchange event 
$(window).bind('hashchange', function() { 
     var slideNo = currentSlide(); 
     // we only want to fire the slide change if the next button or the pager hasn't done it for us 
     if (hasSlid === 0) { cycleSelector.cycle(slideNo); } 
     // return it back to zero 
     hasSlid = 0; 
}); 

// when the page loads, we need to trigger a hashchange 
$(window).trigger("hashchange"); 

function onBefore() { 
      var title = $(this).find('h1').html(); 
      $('#caption') 
      .html(title); 
     }; 

}); 


function setSlide(index) { 
      $('.images').cycle(index); 
     } 
+0

你应该看看window.onhashchange事件和编写您对本 – 2013-05-13 13:40:18

+0

喜烤逻辑,谢谢你的建议,我有后退按钮现在的工作,但它有停止我的内部链接(幻灯片)以注册URL。是否有可能让这些链接也具有相同的行为?再次感谢 – Nick 2013-05-13 15:50:13

回答

1

对于任何人谁是有兴趣我想通了这一点。在上面的代码,你需要改变这一点:

function setSlide(index) { 
     $('.images').cycle(index); 
    } 

这样:

function setSlide(index) { 
      $('.images').cycle(index); 
      window.location.hash = "slide-"+ (index) + ""; 
      return false; 
     } 

,然后继续创建与下面的内部链接,这取决于滑动你换号要链接到

<a href="javascript:setSlide(1)"></a>