хочу чтоб по клику открылось окно
Тут будет текст
хочу чтоб по клику открылось окно
Тут будет текст
В результате предыдущих экспериментов я спрограммировал свое модальное окно на jQuery из следующих соображений требований.
Эксперименты с командой скрыть блок
Эксперименты с командой показать блок. Скрытие по клику на предыдущей гиперссылке.
Эксперименты с командой показать блок с фоном. Скрытие по клику на фоне.
Эксперименты с командой показать фон. Скрытие по клику на фоне.
Читать далее Изучаю CSS, JS и jQuery. 5
Простейшее модальное окно
Теперь посмотрим, как на основании полученных знаний сделать другое всплывающее по клику окно. Изменим стиль - возьмем его из примера, найденного в интернет. Изначально окно некорректно позиционировалось - по центру реальной страницы, которая может быть больше размеров экрана. Вот так был определен div-блок и стиль в интернет-примере:
Читать далее Изучаю CSS, JS и jQuery. 3
Еще пример модального окна
Теперь посмотрим, как на основании изученной простейшей функции сделать всплывающее по клику окно. Введем div-блок со стилем, взятым из рассмотренного примера всплывающего окна.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumyeirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diamvoluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam[...]
Покажем это окно при помощи команд, изученных в предыдущем уроке, показать и скрыть упомянутый div-блок. Команды
1 2 |
<a onclick="$('#my_w1').hide()">Скрыть упомянутый div-блок</a> <a onclick="$('#my_w1').css('display','block')">Показать упомянутый div-блок</a> |
Библиотека jQuery позволяет полностью избавить разметку от встраиваемых сценариев благодаря ее способности с легкостью перехватывать элементы страницы и присоединять к ним код естественным, CSS-подобным способом. Библиотека jQuery не ограничивается лишь вмешательством в HTML-код существующих страниц — она также позволяет добавлять новые элементы страниц и фрагменты документов с помощью коллекции удобных функций. Существуют функции для вставки новых HTML-фрагментов в любую часть страницы. Можно перемещать, удалять или клонировать существующие элементы.
Читать далее Изучаю CSS, JS и jQuery. 1
Как найти, показать и скрыть div-блок
Сначала информацию, варианты отображения которой будем исследовать, поместим в div-блок с заданным классом:
1 2 |
<div class="my_w" align="center">[latex]\mu[/latex] - греческая буква в кодировке Латех. Видно? </div> |
Я помещаю код плагина спойлера в div-контейнер с id="vertical_1" и буду изучать возможности изменения его позиционирования. Код div-блока, отображение которого исследуется
1 |
<div id="vertical_1">[su_spoiler title="Тестовый спойлер в блоке" icon="caret"]Текст внутри тестового спойлера, помещенного в блок "vertical_1".[/su_spoiler]</div> |