JQuery Mobile Popup with Canvas

Я ищу, чтобы создать всплывающее окно в JQuery Mobile, в котором есть встроенное в него холст.JQuery Mobile Popup with Canvas

Фокус в том, что мне нужно всплывающее окно/cavans для запуска в ландшафтном режиме .. вне зависимости от текущей ориентации экрана?

Любые советы?

Благодаря

источник

2014-09-10 user1763684

поэтому, если пользователь держит устройство в портретном режиме, вы хотите, чтобы всплывающее окно развернулось на 90 градусов или просто содержимое холста? – ezanker

Да. Это точно. Я делаю приложение подписи (используя html Canvas) .. и я хочу, чтобы холст отображался во всплывающем полноэкранном режиме в портретном режиме. У меня есть canvas/jquery, работающий для подписи ... Я просто пытаюсь разобраться в всплывающей/альбомной проблеме. Спасибо. – user1763684

Вы можете использовать CSS преобразования на содержание всплывающего, чтобы повернуть его на 90 градусов, когда вы обнаружили устройство находится в портретном режиме.

Создать класс CSS, который выполняет вращение (-90 для против часовой стрелки, 90 для по часовой стрелке):

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

Тогда на событии всплывающее окно popupbeforeposition, проверьте ориентацию и либо добавить или удалить класс 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 Mobile Popup with Canvas

ответ

Смежные вопросы