Какой код можно использовать для создания отдельного div-шоу только в том случае, если на мобильной ширине?
У меня полноразмерный div шириной 100% в верхней части экрана, хотелось бы, чтобы он показывал только, когда устройство указано как мобильная ширина.
Я не уверен, что вы подразумеваете под "мобильной шириной". Но в каждом случае CSS @media может использоваться для скрытия элементов в ширине экрана. См. Пример:
<div id="my-content"></div>
...а также:
@media screen and (min-width: 0px) and (max-width: 400px) {
#my-content { display: block; } /* show it on small screens */
}
@media screen and (min-width: 401px) and (max-width: 1024px) {
#my-content { display: none; } /* hide it elsewhere */
}
Некоторое действительно мобильное обнаружение - это сложное программирование и довольно сложно. В конце концов посмотрите: http://detectmobilebrowsers.com/ или другие похожие источники.
Похоже, вам может потребоваться доступ к окну просмотра устройства. Вы можете сделать это, вставив этот метатег в свой заголовок.
<meta name="viewport" content="width=device-width, initial-scale=1.0">