캔버스가있는 JQuery 모바일 팝업

캔버스가 포함 된 Jquery Mobile에서 팝업을 만들려고합니다.캔버스가있는 JQuery 모바일 팝업

트릭은 화면의 현재 방향과 상관없이 가로 모드에서 실행하기 위해 팝업/cavans가 필요하다는 것입니다.

어떤 조언이 필요합니까?

감사

2014-09-10 user1763684

사용자가 세로 모드에서 장치를 잡고있는 경우 전체 팝업을 90도 회전 시키거나 캔버스의 내용 만 회전 시키시겠습니까? – ezanker

예. 바로 그 것입니다. (html Canvas를 사용하여) 서명 앱을 만들고 있습니다. 캔버스가 팝업, 전체 화면, 세로 모드로 나타나길 원합니다. 캔버스/jquery 서명을 위해 노력하고 있어요 ... 그냥 팝업/가로 문제를 파악하려고합니다. 고맙습니다. – user1763684

당신은 CSS 당신이 장치가 세로 모드에 감지 할 때 90도 회전하는 팝업 내용을 변환 사용할 수 있습니다. 팝업 popupbeforeposition 이벤트에 다음

.rotateCCW { 
    -ms-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
    -o-transform: rotate(-90deg); 
    -webkit-transform: rotate(-90deg); 
    transform: rotate(-90deg); 
}

방향을 확인하거나 추가하거나 CSS 클래스를 제거합니다

(시계 방향으로 90, 시계 반대 방향으로 -90) 회전을 수행하는 CSS 클래스를 만듭니다 여기

$("#popupDialog").on("popupbeforeposition", function(event, ui) { 
    if (is_landscape()){ 
     $("#popupDialog").removeClass("rotateCCW"); 
    } else { 
     $("#popupDialog").addClass("rotateCCW");    
    }  
}); 

function is_landscape() { 
    return (window.orientation === 90 || window.orientation === -90); 
}

은 DEMO
이다

출처

2014-09-10 18:35:01 ezanker

캔버스가있는 JQuery 모바일 팝업

답변

관련 문제