Проблемы с разрешением, слетает шаблон

[OldAine]

Добрый день.

Есть сайт Shop-Board.ru

Незадача оказалось в том, что при увеличении сайта скажем на 150% background в футере и в хедере не растягивается, как указано в стилях, на 100%. То есть увеличил, прокрутил вправо и беда.

Не могу понять откуда у проблемы ноги растут.

Чтоб было понятнее вот скрины -> ПЕРВЫЙ, ВТОРОЙ

Можно было бы конечно не париться, ведь на стационарах при нормальном разрешении все гуд, но на айфонах и айподах такой вид с самого начала загрузки сайта =(

[RGB]

По моему виновата эта анимированная жесть на флеше в шапке

[OldAine]

По моему виновата эта анимированная жесть на флеше в шапке

Ну с шапкой предположим, что флешка виновата, ну а на подвал сайта тоже она влияет? :unsure:

Кстати есть у меня на локале шаблончик собственной разработки, где в шапке сайта такая же ерунда творится, а там вообще нет никаких флешек, шаблон из оригинального переделывался! Я просто добавил в самый верх шапки два дива(друг под другом), раскрасил их и указал width: 100%, а эффект такой-же :(

[12strun]

На айфонах и айпэдах флеши не отображаются...

[RGB]

На айфонах и айпэдах флеши не отображаются...

кроме сафари, есть и другие браузеры, более лояльные к флешу :-)

[12strun]

Ну да, про сафари и имелось ввиду... :oops:

[tim21701]

Flash - однозначно зло.И не только потому что на мобильных платформах от Apple они не работают....

...По статистике, почти четверть сотрудников компаний ежедневно посещают сайты социальных сетей, блоги, развлекательные, игровые, интернет-магазины и другие сайты в рабочее время. То есть каждый четвёртый сотрудник, работающий на офисном ПК с доступом в Интернет, ежедневно тратит оплачиваемое работодателем время на посещение ресурсов, не связанных с его работой… И практически у всех этих компаний есть одна особенность: они активно борются с распи*дяйством своих сотрудников в рабочее время. Руководство искренне верит в то, что на работе нужно работать, а не видео смотреть и в игрушки играться.

А в чем нынче распространяется весь развлекательный контент? Правильно, во флэше.

Поэтому суровые админы таких компаний просто блокируют подобные файлы на уровне корпоративного файервола. Конечно, решить вышеупомянутые проблемы можно легко, если использовать SWFObject. Но, не всё так просто...

Как это выглядит на практике с точки зрения веб-разработчика.

После загрузки страницы SWFObject радостно сообщает: «Флэш-плагин у пользователя есть!». Разработчик без тени сомнения заменяет html-меню на флэшовое: это ведь так просто, написал swfobject.embedSWF() и все само работает. Но не тут-то было: между браузером пользователя и интернетом стоит злобный файервол, который, сверившись со своим черным списком, просто блокирует доступ к swf-файлу. В итоге пользователь остался и без html, и без флэша. Он не сможет даже просто открыть страницу, на которой был размещён флеш-блок. И это при том, что у него может стоять самая последняя версия флэш-плеера...

И ещё, учтите, что многие отключают у себя flash (посредством flashblock) что бы "порезать" рекламу (посредством adblock), для того что бы была возможность страницы читать, а не тупо таращиться, пытаясь на уровне мозга отсеять бессмысленное и бесполезное мельтешение убогой рекламно-декоративной анимации, всякого рода рекламы и дурацкие промоушины новых моделей девайсов на сайтах производителей. И не забывайте, что у Flash большие проблемы с индексацией...

[OldAine]

Действительно про то, что планшетки не поддерживают флеш я и забыл.

Ну тогда для начала избавлюсь от флеша, а если проблема не пропадет, то опять буду вам надоедать)

А пока что, всем спасибо за участие =)

[OldAine]

И снова всем привет!)

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

Тут я провел некоторое исследование и вот что обнаружил - На всех сайтах с блоками растянутыми на 100% от края до края, есть один и тот-же баг! Стоит уменьшить окно браузера или просто открыть в телефоне, как часть растянутого на 100% блока просто пропадает и остается только контент на background-e.

Вот несколько примеров:

откройте любой браузер и начните увеличивать %-ый размер, либо сразу с mobile-устройств смотрим.

Пример 1 - проверьте розовую шапку сайта.

Пример 2 - шапка и подвал

Пример 3 - шапка и подвал

Пример 4 - шапка и подвал

Может кто-нибудь знает как победить недуг? фиксированное указание ширины помогает лишь частично и только на pc...

PS: Пытаясь предугадать сразу скажу, что про респонсив знаю, но делать еще не умею.

[askirov]

Вот используйте этот код для всех блоков с фиксированной шириной. Просто вписывайте размеры при стандартных разрешениях экрана.

/* MEDIA QUERIES -------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
   /* Styles */

}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px)
and (max-width : 480px) {
   /* Styles */

}

/* iPads (portrait) ----------- */
@media only screen
and (min-width : 481px)
and (max-width : 768px) {
   /* Styles */

}

/* iPads (landscape) ----------- */
@media only screen
and (min-width : 769px)
and (max-width : 1024px) {
   /* Styles */

}

/* Larger screens ----------- */
@media only screen
and (min-width : 1024px) {
   /* Styles */

}

[OldAine]

Ну видимо других способов решений проблемы нет. Придется изучать, надо ведь идти в ногу со временем)

[Гість]

mabibaТОЧКАru 

На мобильных устройствах идет переадресация на скачивание флеш плеера. В чем может быть дело?