Page 195 - Сила CSS3 Освой новейший стандарт
P. 195
Динамическая подсветка разделов страницы • 195
Помимо подсветки заголовка текущего раздела страницы, псевдокласс :target можно ис-
пользовать для решения следующих задач:
• подсветка сносок;
• отображение пояснения рядом с целевым заголовком для предоставления пользова-
телю более обширного контекста (см. http://web-graphics.com/mtarchive/001454.php);
• перенос элемента в начало стека перекрывающихся полей или изображений (см. http://
virtuelvis.com/archives/2003/07/target-fun);
• набор полей с различным содержимым, оформленный в виде вкладок (см. http://css-
tricks.com/5841-css3-tabs);
• меню формата «аккордеон», развертывание и свертывание полей с содержимым (см.
http://www.paulrhayes.com/2009-06/accordion-using-only-css и http://www.thecssninja.
com/css/accordian-effect-using-css);
• слайд-шоу (см. http://www.dinnermint.org/css/using-css3s-target-pseudo-class-to-make-
a-slideshow и http://www.nealgrosskopf.com/tech/thread.php?pid=45);
• галереи изображений (см. http://www.tobypitman.com/pure-css-sliding-image-gallery,
http://www.ie7nomore.com/fun/scroll и http://www.ie7nomore.com/fun/slideshow);
• модальные окна и лайтбоксы (см. http://sixrevisions.com/css/semantic-css3-lightboxes
и http://www.thecssninja.com/css/futurebox2).
Обратите внимание, что некоторые из этих методов, вероятно, проще и удобнее реа-
лизовывать с помощью JavaScript, а не CSS, так как в версии CSS возможны проблемы
с доступностью содержимого и удобством доступа. Тем не менее они могут оказаться по-
лезны в каких-то других обстоятельствах или подсказать вам варианты прочих способов
эффективного применения :target. Рассматривайте ресурсы в приведенном выше списке
как источник вдохновения.
Таблица 5.4. Поддержка :target в браузерах
IE Firefox Opera Safari Chrome
Да, начиная с версии 9 Да Частично* Да Да
* Браузер Opera поддерживает псевдокласс :target, однако не убирает стилизацию
:target при переходе от цели вперед и назад с помощью кнопок Back (Обратно)
и Forward (Вперед).
Обходные пути для IE
IE 8 и более ранние версии не поддерживают псевдокласс :target. Разумеется, оглав-
ление со ссылками будет работать, и пользователи IE смогут переходить к нужным
разделам, однако заголовки разделов подсвечиваться не будут. Поскольку большин-
ство страниц все равно работают именно так, вряд ли пользователи IE 8 заподозрят,
что в оформлении этой статьи чего-то не хватает. Да и шансы, что читатели этой
небольшой статьи потеряются в содержимом, также крайне невелики.
www.trk.kg