Определить мобильные CSS стили стороннего элемента на сайте, подгруженного асинхронно (AJAX)?
Здравствуйте. Занимаюсь разработкой (доработкой) сайта в рамках своего проекта и регулярно сталкиваюсь со следующей задачей: есть сторонний виджет (например, онлайн чат), установленный на сайт путем добавления их скрипта. Скрипт асинхронно, видимо через AJAX, загружает DOM элементы виджета и его стили. При этом эти элементы и стили не видны через Ctrl+U, но обозримы через Firebug или F12. Таким образом видно то, что в итоге закачал скрипт, НО только не для мобильных телефонов. Точнее если скрипт вносит элементы и стили исходя из Width устройства - проблем нет, сужаешь браузер и запускаешь firebug - всё видно. Но есть скрипты, определяющий устройство по другим критериям и сузить браузер задачу не решит, так как скрипт подгружает элементы DOM и стили для компьютеров.
В итоге вопрос: как можно полноценно сэмулировать просмотр сайта, как с мобильного устройства, и посмотреть при этом весь код сайта, с учетом подгруженного асинхронно через AJAX?
Спасибо!
Для теста беру сайт OZON'а, который загружает мобильную версию, исходя из user-agent'a, а не по разрешению. Есть несколько способов, но если вкратце и с помощью Chrome или Firefox, то...
Chrome:
Firefox:
Ну и после всего вышесказанного смотрите те ресурсы, которые загрузились. Так же, в режиме отзывчивости там много есть доп. опций для более точной подстройки, если надо.
Да!!! Удалось, но только через Firefox с эмуляцией сенсорного ввода. В Chrome (которым я и пользуюсь) нет данной эмуляции и данный виджет Jivosite отображался как на компе. Громадное спасибо за решение и User agent. Теперь буду использовать этот термин вместо "анализирует другие факторы" :)
в Chrome тоже должно быть всё в порядке, смотрите внимательнее, я в Chrome кучу раз JivoSite ловил.
. Я разобрался почему не отображает в chrome. На сайте, где стоит виджет не прописан viewport (да и такое бывает, особенно если сайт написал я :) ). В общем где
