bxslider와 url 간의 실제 연결

Question

bxslider와 url 간의 실제 연결은 다음 예제와 같이과 같습니까?

www.domain.com/#slide-01 
www.domain.com/#slide-02 
www.domain.com/#slide-03 

사용자가 슬라이드를 변경하는 경우 URL이를 업데이트해야하고 또한 url + #Anchor에 의해 bxslider 운전 좋을 것이다. 사용자가 www.domain.com/#slide-02을 입력하면 두 번째 슬라이드가 표시됩니다.

<div class="bxslider-images"> 
     <div id="slide-01"><img src="image_01.jpg" border="0"></div> 
     <div id="slide-02"><img src="image_02.jpg" border="0"></div> 
     <div id="slide-03"><img src="image_03.jpg" border="0"></div> 
</div> 

편집 : baao 슬라이더의 도움으로 이제 id's of the slides에 의해 구동하지만, 슬프게도 그것은 URL이는 2 슬라이드를 skipps, 지금 올바른 경우에도, 동기화이다.

$(document).ready(function(){ 

    var sliderImages = $('.bxslider-images').bxSlider({ 

     pager:false, 
     startSlide: 0, 
     infiniteLoop: false, 
     onSlideNext: doThis, 
     onSlidePrev: doThis, 

    }); 

    function doThis(element, old, newslide){ 
     var urlWithoutAnchor = document.URL.replace(/#.*$/, ""); 
     var newUrl = urlWithoutAnchor + '#' + element.attr('id'); 
     console.log(newUrl); 
     window.location = newUrl; 
     sliderImages.goToSlide(newslide); 

    } 

}); 

어떤 도움을 주시면 감사하겠습니다.

Answer 1

이 코드를 사용하여이 작업을 수행 할 수 있습니다

var url = window.location.href; 
if (url == 'http://www.domain.com/') // or whatever it is 
{ 
window.location.href = url + '#slide-01'; // etc... 
} 

을 슬라이드 함수 내!

편집 :

나는 bxslider 사용하지 않기 때문에이 작동하는지 나는 100 % 확실하지 않다, 그러나 당신의 요구에 맞게 수 있습니다 내가 편집 한

$(document).ready(function(){ 


var url = window.location.href; 

var slide = url.split('#'); 
    if (slide[1]) { 


var slidenumber = slide[1].replace(/([a-z,0,/-])/g, ''); 
    } 

if (!slidenumber) { slidenumber = 0;} 


var sliderContent = $('.bxslider').bxSlider({ 
    pager:false, 
    startSlide: slidenumber, 
    var urlWithoutAnchor = document.URL.replace(/#.*$/, ""); 
    //location.hash.replace('#','') 
    window.location.href = urlWithoutAnchor + '#' + newslide; 
}); 

});