2014-01-14 11 views
0

휴대 전화에서의 스크롤링 성능 향상을 위해 iScroll 5로 업그레이드하고 싶지만 Magnificopopup 라이브러리는 iPhone/iPad에서 작동하지 않습니다. 여기 이 문제 보여주는 2 개 코드 샘플은 다음과 같습니다 iScroll 5 두 예제는 바탕 화면에 작업 Magnificopopup이 iScroll 5와 호환되지 않음

과 아이 패드에 iScroll 4.2.5

  • Example of zoom NOT working와 아이폰/아이 패드에

    1. Example of zoom working을하지만, iPhone/iPad에서 iScroll 5를 사용하는 예 2는 그림을 클릭 할 때 Magnificopopup 모달을 열지 못합니다.

      이 충돌을 일으킬 수있는 원인에 대한 단서가 있습니까?

  • 답변

    2

    기본적으로 iscroll은 touchevent의 기본 onBeforeScrollStart를 금지하므로 iscroll이 사용자가 스크롤하지 않았 음을 알게되면 click 이벤트가 시뮬레이트되고 대상 요소에 전달됩니다.

    훌륭하지만 일부 요소 (텍스트 필드, 앵커 태그, 하이퍼 링크가있는 이미지 태그)는 포커스를 받았을 것입니다. 그것은 불행하게도 고려되지 않았습니다.

    이 문제를 극복하려면 iscroll.js 또는 iscroll-lite.js 다음 줄에 HTML 태그를 추가 할 수 있습니다. js 파일에서 preventDefaultException을 검색하고 수행 할 작업을 수행 할 태그를 추가 할 수 있습니다.

    기본값은

    preventDefaultException: { tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT)$/ }, 
    

    내가, 그것을 확실히 작동합니다

    preventDefaultException: { tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT|A|IMG)$/ }, 
    

    친애 즐길 그것에 "A""IMG" 태그를 추가했습니다.

    위의 방법 대신 할 수있는 것에 대해서는 click 및 zoom을 true로 설정할 수도 있습니다. 당신이 선언

    var myScroll = new IScroll('#wrapper', { click: true, zoom: true }); 
    

    객체 IScroll 동안 클릭 한 줌 이벤트에 대한이 작동합니다.

    +1

    var myScroll = new IScroll ('# 래퍼', {클릭 : 참, 확대/축소 : true}); – Mavichow