Friday, September 26, 2014

Framewor7, Panel и опять Internet Explorer

На форуме F7 был вопрос о том, что пример  Split View Application With Degradation To Panel ведёт себя не корректно на Андроиде до 4.4 и Сафари для Виндовс. Ну конечно, это привет от Webkit'a старой версии.



Как обычно используется функция calc для вычисления размера правой части панели. Просто и элегантно
width: calc(100% - 320px)
Как обычно, в вышеуказанных браузерах это не работает.Поиски решения привели к javascript фиксу

window.onresize = function(){
if($$("body").width() > 769){
$$("div.view-main").css("width",($$("div.views").width() - 320)+"px");
} else {
$$("div.view-main").css("width",($$("div.views").width())+"px");
}
};
window.onresize();
Который заменяет собой css функцию calc() и работает во всех браузерах.  Вызываю это дело после
// Export selectors engine
var $$ = Dom7;
чтобы иметь доступ к DOM.

Но это еще не всё. Оказалось, что в ИЕ если левая панель скрыта и открыть её по кнопке справа вверху, панель открывается (и даже закрывается), но ссылки не доступны для нажатия, но видны.



Методом тыка выяснилось, что если выставить
.panel {
    overflow: visible; // или hidden но не auto
}
То ссылки начинают нормально откликаться. Занёс это правило в f7fix.css

Но и это еще не всё с панелями. На сцене появляется Windows Phone, со своей версией ИЕ. Там вообще происходит интересное. Панель появляется слева, но потом перескакивает еще правее, примерно, на середину экрана и всё на клики больше ни какие не реагирует. Подвисает чтоли?

Я добавил вызов alert() в обработку окончания транзишн эффекта, когда алерт() появляется, то панель еще находится на своём месте, как алерт() закрывается, панель перескакивает в середину (предполагаю, что на 260px). Девайса нет под рукой, скриншот не могу сделать. Проблема еще в том, что в ИЕ десктопном, в режиме эмуляции, всё работает нормально. Так что отловить или поиграться со свойствами не получается. Тот же баг есть и в Kitchen Sink. Так эту несовместимость F7 и WP IE, которую пока победить не получается.

UPD Блокировка ссылок на WP решилась тем же overflow: visible; смещение панели осталось.

No comments: