Автоматический ресайз адаптивного блока - реально?

big boy
На сайте с 18.11.2006
Offline
356
1264

Поставил адаптивный блок и че-то приуныл и разочаровался. Либо руки крюки, либо адсенс не смог.

При ручном ресайзе окна браузера рекламный блок остаётся таким же, как при первой загрузке страницы. Если окно было маленьким - загружается маленький блок, который влезает в адаптивно-резиновый диз, но если окно изначально было на весь экран, а потом его сжать - блок начинает заползать на соседние элементы, сайдбар например, а не уменьшается вместе с шаблоном, что не айс.

Несколько минут гугления и выясняется, что это известная проблема и адсенсовцы её почему-то никак не закроют с момента самого внедрения адаптивного блока.

В CSS указаны размеры родительского дива, в котором сидит блок и через @media в зависимости от окна указываются точные значения ширины и высоты. Подробнее можно прочитать здесь.

Если через display:none/block прятать/показывать большие/маленькие блоки, то такой метод тоже весьма неадекватен - при уменьшении окна большой блок прячется, а вот мелкий на его месте почему-то не появляется. Зато если перезагрузить страницу, то всё ок - маленький отобразился, окно увеличили - вылез большой на его место.

Есть еще одно решение, которое подсмотрел здесь. Вкратце - небольшой js скрипт, который на лету проверяет размер экрана и перезагружает рекламный блок, подставляя значения ширины. Всё бы хорошо, но выдаёт ошибку у меня (сделал копипаст с сайта автора):

Как можно исправить?

✔ Как я генерирую статьи через ИИ, которые приносят трафик - https://webmasta.ru/blog/16-vkalyvayut-roboty-ne-chelovek-stati-s-pomoschyu-ii-kotorye-prinosyat-trafik
A
На сайте с 29.10.2013
Offline
35
#1

в примере используется библиотека jquery, а не чистый js

r27
На сайте с 11.06.2012
Offline
105
r27
#2
big boy:
При ручном ресайзе окна браузера рекламный блок остаётся таким же, как при первой загрузке страницы. Если окно было маленьким - загружается маленький блок, который влезает в адаптивно-резиновый диз, но если окно изначально было на весь экран, а потом его сжать - блок начинает заползать на соседние элементы, сайдбар например, а не уменьшается вместе с шаблоном, что не айс.

А зачем это надо? Народ ведь в основном заходит на страницу с определенных устройств, у которых уже задано разрешение.

Никого не консультирую и ничего не оптимизирую.
vob2014
На сайте с 30.03.2014
Offline
91
#3

в css есть scale - просто масштабировать с нужными коэф. адсенсе окруженный div (масштабируется образ bmp (div-а) на canvas-е, сам div и адсенсе внутри даже не знает что его отмасштабировали, кликабельность адсенса сохраняется)

конечно это жесточайшее мерзкое извращение, но работает...

...
big boy
На сайте с 18.11.2006
Offline
356
#4
r27:
А зачем это надо?

Согласен, но вот хочется, чтобы всё по максимуму было адаптивным.

vob2014:
конечно это жесточайшее мерзкое извращение, но работает...

Можно попробовать.

alabersa:
в примере используется библиотека jquery, а не чистый js

У меня подключен jquery 1.7.2. Более того, тестил код на jsfiddle - та же ошибка.

vob2014
На сайте с 30.03.2014
Offline
91
#5

а где ссылка на jsfiddle ?

imho у вас невидимый юникодный символ где-то залез...

наберите руками с клавы (а не копи паст) тоже самое в ansi кодировке notepad++ и все будет Ок.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий