Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   не работает адаптация на мобильном (https://javascript.ru/forum/dom-window/55010-ne-rabotaet-adaptaciya-na-mobilnom.html)

майрбек95 09.04.2015 22:52

не работает адаптация на мобильном
 
Доброго времени суток! Впервые начал делать адаптивные шаблоны но наткнулся на такую проблему: уменьшив окно браузера до появления мобильной версии все работает корректно (мобильная версия отображается корректно) но зайдя через телефон после нескольких переходов по страницам на экран телефона высвечивается компьютерная версия а мобильная возвращается только после чистки истории, кеша и т. д. бразуреа, адаптацию делаю с помощью css атрибута @media, в чем может быть проблема, может нужно прописать какойто js?

Brutus 09.04.2015 22:55

Экстрасенсов тут нет,код в студию!

Если не хочешь давать код выясни в чем проблема конкретно, кэш или куки, если кэш попробуй с другого смарта, если куки то сам намудрил

майрбек95 09.04.2015 22:59

вот сам css код
@media only screen and (min-width: 240px) and (max-width: 768px){
 body {
 background-color: #fff;
 background-image:none;
}
 .block_ava {
 padding-bottom: 0px;
 border-bottom-width: 0px;
 border-bottom-style: none;
}
 .content_width {
 width: 100%;
 min-width:240px;
}
.container_bg {
 display:none;

}
.menu_hor {
display: block;
}
#puzadpn {display:none;}
uMenuRoot li {
 list-style-type: none; /* Убираем маркеры */
 }
 uMenuRoot ul {
 margin-left: 0; /* Отступ слева в браузере IE и Opera */
 padding-left: 0; /* Отступ слева в браузере Firefox, Safari, Chrome */
 }
.uMenuRoot, .uMenuRoot li {margin:0px;padding:0px;list-style-type:none}
.uMenuRoot {margin-bottom:15px !important}
.uMenuRoot li a {
 display:block;
 text-decoration:none;
 font-size:14px;
 color:#ccc;
 padding-top: 10px;
 padding-bottom: 10px;
 font-weight: normal;
}
.uMenuRoot li a:hover {
 color:#FFF
}.content_width {-moz-box-shadow: 0px 0px 0px rgba(150, 150, 150, 00);
-webkit-box-shadow: 0px 0px 0px rgba(150, 150, 150, 0);
box-shadow: 0px 0px 0px rgba(150, 150, 150, 0);
filter: progid:DXImageTransform.Microsoft.Shadow(strength = 1, direction = 90, color = '#000000');
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 1, Direction = 90, Color = '#000000')";
 width: 100%;
}
}


больше нет.

Если 4 раза обновить страницу на смартфоне он переходит на пк версию пробовал и сдругого смартфона

майрбек95 09.04.2015 23:06

даже вот сайт полистайте страницы и мобильная версия превратиться в пк версию

Brutus 09.04.2015 23:26

юзай max-device-width и соответственно min-device-width

И вообще http://www.javascriptkit.com/dhtmltu...queries2.shtml

майрбек95 09.04.2015 23:35

все гораздо проще просто мне нужно было добавить

<meta name="viewport" content="width=device-width, initial-scale=1.0" />


и все дела.

Brutus 09.04.2015 23:40

Это не все то что было нужно в данном случае, так как при уменьшении окна браузера сайт превратится в мобильную версию, а это не есть хорошо.

p.s. что у тебя тайтлы и прочее содержимое тега <head> делает в <body>

майрбек95 09.04.2015 23:51

Цитата:

Сообщение от Brutus (Сообщение 365828)
что у тебя тайтлы и прочее содержимое тега <head> делает в <body>

в смысле?? это где?

Brutus 10.04.2015 00:18



Часовой пояс GMT +3, время: 23:44.