iOS WebView에 표시되는 JQuery 1.4로 작성된 멀티 페이지 앱이 있습니다. 그것은 정적 헤더를 사용하고 컨텐츠에는 20 개 정도의 이미지와 텍스트가있는 div가 있습니다. PhoneGap을 사용하지 않습니다.JQuery Mobile iOS에서 부드럽게 스크롤되지 않습니다.
사파리의 WebView 및에서는 콘텐츠를 세로로 스크롤 할 수 있지만 iOS 앱에서 얻을 수있는 것과 동일한 부드러움을 얻지 못합니다 (예 : 손가락이 생기면 스크롤이 계속됩니다. = "부드럽게"스크롤). 손가락이 화면에서 빠져 나오면 스크롤이 멈 춥니 다.
JQuery Mobile에서 원활한 콘텐츠 스크롤에 관해서 알지 못하는 설정이나 문제가 있습니까?
아마도이 문제는 이미지/div를 그리는 데 많은 처리 능력이 필요하다는 것입니다. 파일을 압축 했습니까?
당신은 더 여기 읽을 수 있습니다 :
이이미지 압축 http://www.html5rocks.com/en/tutorials/speed/img-compression/ ** 연결하면 문제가 발생할
CSS 페인트 시간을 사용할 수있는 애플 리케이션을 위해 아래로 스크롤 http://www.html5rocks.com/en/tutorials/speed/css-paint-times/ ** 확인을 클릭 할 수 있도록 하단의 "Continuous Paint Times"링크를 클릭하면 페인트 시간을 프로파일 링하는 방법을 볼 수 있습니다.
희망이 도움이됩니다.
: 나는 당신이 더 이상 <body> 요소를 스크롤 있다는 사실과 관련이있다 생각 http://davetayls.me/jquery.kinetic/
을, 오히려 JQuery Mobile Page <div>. <div>을 JQuery Mobile없이 스크롤 할 수 있다면이 고르지 못한 환경을 그대로 재현 할 수 있어야합니다. 당신이 실제로 스크롤 모멘텀라고 찾고 있습니다 때로는 또한 관성이 스크롤이라 무엇
.
아마도 기수 스크롤을 추가 할 div에 CSS 속성 -webkit-overflow-scrolling: touch;을 추가 할 수 있어야합니다. 작동해야하지만이 기능을 페이지에서 작동시키지 못했습니다. 나는 그것을 몸에 붙이려고했는데, 나는 적당한 스크롤을 얻을 수 있었지만, 스크롤하는 동안 내 고정 헤더가 튀어 나오기 시작했다.
고정 헤더가없는 경우 언제든지 알려주세요.
body {
-webkit-overflow-scrolling: touch;
}
그래서 제 경우에는 다른 사람이 앱을 사용하고 나쁜 CSS 규칙을 적용하여 나쁜 경험을하게했습니다. 나는 JQuery Mobile CSS를 제외한 모든 CSS를 제거하여 이것을 발견했다. 그런 다음 잘못된 규칙을 찾을 때까지 사용자 정의 CSS의 나머지 부분을 천천히 추가했습니다. 꽤 짜증이 났지만 같은 프로젝트에서 여러 사람이 작업 한 결과입니다. 처음에 JQuery Mobile이라고 생각한 이유는 JQuery Mobile을 제거하려고 시도했기 때문이며 그 앱은 JQuery Mobile 없이도 정상적으로 작동했습니다. 그래서 나는 2 개의 규칙이 경쟁하고 있었다고 생각한다. –
챔피언! 이것은 많은 도움이되었습니다. –
나에게 도움이되었다. 스캇 고마워! 프로젝트에서 "나쁜 규칙"으로 식별 한 것을 추가로 알려주시겠습니까? – marcel
많은 플랫폼에서 작동하는 nicescroll 플러그인을 사용할 수 있습니다.
설치 :가 사용
<script src="jquery.nicescroll.js"></script>
: 문제는 여기에
$(document).ready(
function() {
$("html").niceScroll();
}
);
우리를 위해 nicescroll plugin
에 대한 참조입니다 jQuery를 모바일의 CSS에 있었고, 우리는 이것을 다음과 같이 고쳤습니다 :
.ui-mobile .ui-page-active{display:block;overflow:visible;/*overflow-x:hidden*/}
Google의 스크롤 오류가 수정되었습니다.
overflow-x: hidden 엉망진창.
그 문제를 가지고 계신 분, 먼저 이것을 시도하십시오! – leymannx
나를 위해,이 방법은 작동합니다. 감사. –
감사합니다. 아마도 문제가 될 수 있지만 실제로 손가락이 아래로 움직이는 한 스크롤링은 실제로 잘 작동합니다. 지터가 없어도됩니다. 문제는 스 와이프 이후입니다. 스크롤은 멈추고 스 와이프의 추진력을 따르지 않습니다 (대부분의 네이티브 스크롤 뷰와 같습니다). – dixkin