Динамические «скриншоты» для демонстраций на странице справки

Question

Я бы хотел улучшить страницу «Помощь» моего сайта, добавив скриншоты различных разделов сайта. Я не решаюсь делать эти статичные изображения, так как сайт все еще находится в разработке и постоянно меняется косметически. На самом деле, я даже думаю, что создание изображений вообще может быть излишним.

Можно ли загрузить (через PHP или JQuery) небольшой раздел (со статическим размером и x y) другой страницы и отобразить его в div?

Answer 1

Мы делаем то же самое в нашем разделе справки, но я думаю, что динамическая загрузка скриншотов в реальном времени - это масса ресурсов.

На самом деле, мы делаем это в процессе сборки, сразу посленаши тесты.Безголовый браузер (selenium под xvfb) используется для создания полноэкранного скриншота наших различных страниц в предварительно развернутом приложении.

Затем, когда произошла модификация, процесс сборки позаботится о включении изменений....

Answer 2

Также очень полезно сделать GIF на экране, чтобы показать пользователю, как сделать что-то быстро, вместо письменных объяснений, поэтому, если есть косметические изменения, пользователь может продолжать видеть, как что-то сделать, вы можете создать Экран записи GIF с http://www.getcloudapp.com

Answer 3

Загрузите страницу, с которой вы хотите создать «скриншот», в <iframe> с нужным размером и используйте якорь или http://api.jquery.com/scroll/, чтобы переместить содержимое в положение, которое вы хотите показать.

если вы не хотите, чтобы пользователь прокручивал или взаимодействовал с iframe, просто поместите поверх него прозрачный слой.