div входит в окно просмотра справа, хотя он был размещен слева на Android

Question

div входит в окно просмотра справа, хотя он был размещен слева на Android

0

Я делаю приложение с apppyver steroids для iOS и Android, и я нашел эту странную ошибку. Хотя div полностью расположен слева от окна просмотра, он входит в область просмотра справа на Android, где он ведет себя как ожидалось на iOS.

CSS

.drawer {

z-inder:100000;
position: fixed;
height: 100%;
width:80%;
margin-left: -80%;
background-color: #111111;

}

Javascript

        $(document.getElementById('drawer')).animate({'margin-left': '0%'}, {queue: false});

Daan Luttik 03 янв. 2014, в 12:06

Источник

Теги:

javascript

jquery

html

android

steroids

1 ответ

Ещё вопросы

enguerranws · Accepted Answer · 2014-01-03T09-01-00.000Z

Вместо margin-left вы можете попробовать с левым свойством, поскольку ваш элемент уже расположен:

.drawer {

  z-inder:100000;
  position: fixed;
  height: 100%;
  width:80%;
  left: -80%;
  background-color: #111111;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

Чтобы предотвратить непонимание JQuery, я рекомендую использовать класс CSS для анимации, чем метод animate() (более плавный на мобильных устройствах).

Ваш новый класс CSS:

.drawer.onScreen {
   left: 0;
}

Ваш новый JS:

$('.drawer').addClass('onScreen');

Кстати, обратите внимание, что ваш старый JS-код использует getELementByID, когда у элемента, на который вы нацеливаетесь, есть только класс.