Шаг 84.
Библиотека jQuery.
Манипулирование деревом DOM. Копирование с целью создания врезок

    На этом шаге мы рассмотрим первый шаг в алгоритме создания врезок.

    На многих веб-сайтах, как и в печатных изданиях, для выделения небольших фрагментов текста и с целью привлечения внимания читателя используются врезки. Мы легко можем реализовать их с помощью метода .clone(). Для начала посмотрим на изменения в третьем параграфе текста из нашего примера:

<span class="pull-quote">Все завидовали  согласию<span class="drop">,  
царствующему</span> между надменным Троекуровым и
<strong>бедным</strong> его соседом</span> и удивлялись смелости сего последнего, 
когда он за столом
у  Кирила  Петровича  прямо высказывал  свое  мнение,  не  заботясь  о  том,
противуречило ли оно мнениям хозяина. Некоторые пытались было  ему подражать
и  выдти из пределов должного повиновения, но Кирила Петрович так их пугнул,
что навсегда отбил  у них  охоту к  таковым 
<a href="http://ru.wikipedia.org/wiki/%D0%9F%D0%BE%D0%BA%D1%83%D1%88%D0
%B5%D0%BD%D0%B8%D0%B5_%D0%BD%D0%B0_%D0%BF%D1%80%D0%B5%D1
%81%D1%82%D1%83%D0%BF%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5">
покушениям</a>,  и  Дубровский  один
остался вне общего закона. <span class="footnote">Нечаянный случай все 
расстроил и переменил.</span></p>

    Обратите внимание, что параграф начинается с элемента <span class="pull-quote">. Элементы с этим классом мы и будем копировать. После копирования текста внутри элемента <span> он будет вставляться в другое место, поэтому нам необходимо изменить его оформление для отделения от остальной части текста.

    На следующем шаге мы рассмотрим стили CSS.




Предыдущий шаг Содержание Следующий шаг