Прокрутка переполнения Div при указании -ms-viewport?

Работа на странице, просматриваемой в Windows Phone 8, и я заметил странное поведение. Когда -ms-viewport задается с шириной или высотой, то кажется, что пользователи больше не могут использовать поведение скроллинга при переполнении: auto или -ms-touch-move: pan-y element.

Кто-нибудь сталкивается с этим поведением или знает какие-либо обходные пути?

Ответы

Ответ 1

Настройка @-ms-viewport { width: auto } может быть неприемлемой для ряда приложений, которые стремятся представить реактивный интерфейс на устройствах Windows Phone. Рабочая альтернатива, которая позволяет вам установить любую ширину видового экрана, которую вы хотите, - установить следующее правило CSS:

body, html { 
  -ms-overflow-style: none !important; 
}

Я скопировал исходный репрограмм и исправил его с помощью этого правила в https://gist.github.com/tjanczuk/7419485. Вы также можете перейти непосредственно на страницу HTML с исправлением с устройства Windows Phone по адресу http://htmlpreview.github.io/?https://gist.github.com/tjanczuk/7419485/raw/9a13fc9ad43f2103d8b9e23e25c7b0672a13385f/gistfile1.html

Ответ 2

Настройка ширины для автоматической (как показано ниже) вместо ширины устройства, как представляется, решает проблему прокрутки. Я взял источник с вашей страницы (http://fiddle.jshell.net/Vk7SR/3/show/light/), упаковал его как приложение WP8 и попробовал Lumia 920.

@-ms-viewport {
    width: auto;
}