2012-06-05 3 views
0

저는 최근 모바일 응용 프로그램 중 하나 인 jQueryMobile을 사용하여 멋진 photoswipe 라이브러리를 구현했으며 iOS 5와 함께 사용하여 작은 문제가 발생했습니다 (다른 사람들도있을 수 있지만, ve는 iOS 5 장치 만 가지고 있습니다). 의 pageshow 이벤트가 발생하고 인스턴스가 부착되었을 때, 내가 전화 했어 : 아래 Photoswipe 갤러리 닫기 이벤트 iOS에서

는 구현 된 자바 스크립트

<script type="text/javascript"> 

    (function (window, $, PhotoSwipe) { 

     $(document).ready(function() { 

      $('div.gallery-page') 
        .live('pageshow', function (e) { 

         var 
          currentPage = $(e.target), 
          options = {}, 
          photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, currentPage.attr('id')); 

         photoSwipeInstance.show(0); 

         return true; 

        }) 

        .live('pagehide', function (e) { 

         var 
          currentPage = $(e.target), 
          photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id')); 

         if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) { 
          PhotoSwipe.detatch(photoSwipeInstance); 
         } 
         console.log($(e.target)); 
         history.back(); 

         return true; 

        }); 

     }); 

    } (window, window.jQuery, window.Code.PhotoSwipe)); 

</script> 

위의 예는 거의 정확하게 구현 가이드는 한 가지 차이점 말하는 것처럼되어있다 "photoSwipeInstance.show (0);" 갤러리를 즉시 표시 할 수 있습니다.

이 모든 것은 잘 작동합니다. 단, 툴바에서 갤러리를 닫을 때 호출 된 페이지가 아닌 정적 페이지로 돌아갑니다.

내 첫 번째 생각은 "onHide"이벤트에 대한 메소드를 구현하고 "history.back();"을 수행하는 것이 었습니다. 문 :

photoSwipeInstance.addEventHandler(PhotoSwipe.EventTypes.onHide, function (e) { 
    history.back(); 
}); 

이 안드로이드에 마법처럼 일했다,하지만 아무것도 iOS에서 일어나지 않았다, 그래서 iOS 기기 다시 더블 역사에 대해 생각 :

photoSwipeInstance.addEventHandler(PhotoSwipe.EventTypes.onHide, function (e) { 
    console.log(navigator.appVersion); 
    if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) { 
     history.go(-2); 
    } else { 
     history.back(); 
    } 

}); 

하지만 여전히 운이 아이폰 OS 그냥 앉아 없습니다 거기에 나와 웃음. 누구든지 실제 html 페이지로 돌아가는 대신 photoswipe 인스턴스를 첨부 한 페이지로 리디렉션하는 가장 좋은 방법을 알고 있습니까? 여기에 최종 JS 마크 업의 예입니다

나는 비슷한 문제가 있었다
<script type="text/javascript"> 

(function (window, $, PhotoSwipe) { 

    $(document).ready(function() { 

     $('div.gallery-page') 
       .live('pageshow', function (e) { 

        var 
         currentPage = $(e.target), 
         options = {}, 
         photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, currentPage.attr('id')); 

        // onHide event wire back to previous page. 
        photoSwipeInstance.addEventHandler(PhotoSwipe.EventTypes.onHide, function (e) { 
         console.log(navigator.appVersion); 
         if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) { 
          history.go(-2); 
         } else { 
          history.back(); 
         } 

        }); 

        photoSwipeInstance.show(0); 

        return true; 

       }) 

       .live('pagehide', function (e) { 

        var 
         currentPage = $(e.target), 
         photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id')); 

        if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) { 
         PhotoSwipe.detatch(photoSwipeInstance); 
        } 

        return true; 

       }); 

    }); 

} (window, window.jQuery, window.Code.PhotoSwipe)); 

</script> 

답변

1

- 내가 iOS의 onHide 이벤트가 발사되지 않는다는 것을 믿고, 그래서 툴바 이벤트를 수신하여 그것을 해결 :

photoSwipeInstance.addEventHandler(PhotoSwipe.EventTypes.onToolbarTap, function(e){ 
if(e.toolbarAction === 'close'){ 
    //i needed to use a specific location here: window.location.href = "something"; 
    //but i think you could use the history back 
    history.back(); 
} 
});