У меня есть большая страница генерации лидов с фоновым изображением http://minkstock.com
Я хочу сделать его совместимым с мобильными устройствами, но не хочу загружать огромное изображение, которое я использую в качестве фона на веб-сайте для настольных компьютеров и планшетов.
Это лучший способ предотвратить его загрузку на мобильном телефоне.
@devundef был прав. Обычно мы вызываем фоновые изображения из CSS. В этом случае медиа-запросов CSS3 было достаточно. Я бы тоже посоветовал следовать этому правилу.
Необязательно (если вы не хотите использовать фон css): Вы когда-нибудь проверяли плагин Foresight.js? Он обнаруживает браузеры вместе с сетью передачи данных: https://github.com/adamdbradley/foresight.js
Это дает вам возможность адаптивной замены изображения в зависимости от браузера пользователя и типа подключения. Хорошо, что вам не нужно удалять свой фон, и вы сможете сохранить согласованность пользовательского интерфейса.
Вы можете использовать css медиа-запросы.
Пример:
// this background will apply only for screen sizes between 320 and 480px
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
background-image: none; // or another image...
}
Дополнительная информация: http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Как предлагает @devundef, вы можете использовать медиа-запросы. Однако ваша базовая реализация должна быть предназначена для мобильного взаимодействия с медиа-запросами, чтобы заменить фон полноразмерным изображением.
Emaill Addressс двумя L :) - person VictorKilo schedule 04.08.2012