Как сделать отзывчивую функцию переключения панели для демонстрации сайта?

Question

Я хочу знать, как сделать отзывчивую панель параметров переключения для демонстрации веб-сайта. Я хочу знать, когда пользователь нажимает на любой отзывчивый значок, например, Рабочий стол, мобильный телефон и т. Д. Шаблон должен автоматически менять свою реакцию. Ниже приведен пример ссылки на сайт, который имеет тот же самый отзывчивый вариант панели внизу страницы.

http://kopatheme.com/demo/upside-demo/

Я хочу, чтобы один и тот же панель для моего демо.

Answer 1

Они используют Javascript/JQuery для управления кнопками. Когда вы нажимаете кнопку, они помещают содержимое веб-сайта в iframe, которое они могут изменять с высотой и длиной. Таким образом, он дает пример того, как он будет выглядеть на рабочем столе, планшете или мобильном телефоне. Они просто меняют высоту и длину iframe, css сделает все остальное. Они используют изображение в качестве фона, чтобы сделать его немного более фантастическим.

для получения дополнительной информации о Фреймы iFrame http://www.w3schools.com/tags/tag_iframe.asp