В данном уроке мы рассмотрим редко упоминаемую фишку HTML5 - contextmenu. Может быть, вы никогда раньше не слышали про такое меню, но в некоторых ситуациях оно может оказаться чрезвычайно полезным. Для чего может быть предназначен атрибут contextmenu? Он позволяет добавлять различные опции в контекстное меню браузера, которое выводится по нажатию правой кнопки мыши, с помощью всего лишь нескольких строк кода HTML даже тогда, когда Javascript отключен. Хотя на текущий момент такой удобный инструмент доступен только в Firefox. Вот как он работает: Демонстрация контекстного меню Действие атрибута Использовать contextmenu гораздо проще, чем может показаться на первый взгляд. Нужно добавить атрибут contextmenu: 1 <section contextmenu="my-right-click-menu"> 2 <!-- 3 Здесь располагается любой код 4 --> 5 </section> Затем создаем меню: 1 <menu type="context" id="my-right-click-menu"> 2 <!-- 3 Здесь располагаются пункты контекстного меню 4 --> 5 </menu> Атрибут id должен соответствовать атрибуту contextmenu. Таким образом, возможно использовать разные контекстные меню для разных частей страницы. Затем добавляем пункты меню. Сначала вставляем пункт меню с текстом и иконкой, затем добавляем ссылку для трансляции ткущей страницы в Facebook, а в финале вставляем ссылку для обновления страницы. Получается контекстное меню с тремя пунктами: 1 <menu type="context" id="my-right-click-menu"> 2 <menuitem label="Не надо тырить картинки" icon="img/forbidden.png"></menuitem> 3 <menuitem label="Facebook" onclick="goTo('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem> 4 <menuitem label="Обновить" onclick="window.location.reload()"></menuitem> 5 </menu> Также можно создавать подменю: 1 <menu type="context" id="my-right-click-menu"> 2 <menuitem label="Не надо тырить картинки" icon="img/forbidden.png"></menuitem> 3 <menu label="Социальные сети"> 4 <menuitem label="Facebook" onclick="goTo('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem> 5 </menu> 6 <menuitem label="Обновить" onclick="window.location.reload()"></menuitem> 7 </menu> Очень интересное и полезное свойство HTML5. Но, его применение ограничивается только браузером Firefox.