전환이 작동하지 않는 이유는 무엇입니까?

jQuery Mobile에서 HTML, CSS 및 ID를 사용하여 웹 사이트를 만들 때 페이지 간을 이동할 때 멋진 전환을 적용하고 싶습니다. 세 개의 버튼이있는 navbar를 사용하지만 전환이 작동하지 않습니다. 그러나 나는 그것을 똑같이 본다. 누구 잘못 알지?전환이 작동하지 않는 이유는 무엇입니까?

데이터 역할에 data-transition="slide"을 넣었습니다.

<a href="http://www.website.com/" data-role="button" data-theme="c" data-mini="true" id="change" data-transition="slide"></a>

출처

2012-09-24 Jonas Ryberg

우리는 몇 가지 코드를 볼 필요 해요 –

WEBB
VERSION –

귀하의 질문에 코드를 넣어주세요. 또한 문제가 무엇인지보기에는 충분하지 않습니다. –

1) 당신은 외부 도메인으로 링크 할 수 없습니다. 전환이 작동하려면 jQuery Mobile이 AJAX를 사용하여 페이지를로드하기 전에 페이지를로드하고 AJAX가 Cross-Origin Resource Sharing (CORS) Policies으로 제한되므로 동일한 도메인에서 페이지를 호스팅해야합니다. 따라서 외부 페이지가 아닌 페이지로 연결하려고하는지 확인하십시오.

2) 이것이 사용중인 모든 코드라면 jQuery Mobile 의사 페이지에 더 많은 구조가 필요합니다. 이것은 jQuery Mobile documentation for Page Anatomy에서 예입니다 : 여기

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Page Title</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> 
</head> 
<body> 

<div data-role="page" id="page1"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <p><a href="#page2" data-role="button" data-theme="c" data-mini="true" id="change" data-transition="slide">I'ma Button</a></p>  
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

</body> 
</html>

는 데모입니다 : http://jsfiddle.net/zaaeM/

출처

2012-09-24 17:00:39 Jasper

물론 나는 그보다 더 많은 코드를 가지고 있지만, 나머지는 생각하지 않았기 때문에 나는 그것을 보여주었습니다. 나머지 코드는 나머지 페이지입니다. Divs, 몸, 머리 등등. 그리고 예제에서 볼 수있는 전환 코드는 동일하므로 작동하지 않는 이유는 여전히 알 수 없습니다. –

하지만 위의 녀석은 헤더에 navbar가 있다면 그렇게 할 수 있다고 말했다. –

http://jquerymobile.com/demos/1.1.1/docs/pages/page-transitions.html. 필자는 페이지 전환에 대한 설명서를 철저히 읽으면서 (필요한 경우 스스로 비활성화) 제안합니다. 기존 브라우저에서 개발중인 경우 전환이 발생하지 않습니다 (브라우저를 업그레이드하는 경우). JSFiddle이 슬라이드 전환 (Chrome 브라우저)을 사용하여 작업 한 것을 확인할 수 있습니다. http://jsfiddle.net/zaaeM/ – Jasper

전환이 작동하지 않는 이유는 무엇입니까?

답변

관련 문제