Просмотр видео в модальных окнах | |
| В этом уроке пойдет речь о том, как предоставить Вашим посетителям просмотр видео в модальных окнах. Это существенно сэкономить свободное место на странице, так как видео ролики не будут видимыми. Они будут появляться только при нажатии на ссылку. Кроме это у данного плагина есть возможность группировки видео по категориям. Первый шаг - как обычно. Подключаем все необходимо е в шапке. Code <script src="js/jquery-1.3.min.js" type="text/javascript"></script> <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script> <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" /> По аналогии с прошлым уроком, вставляем ссылку на видео с атрибутом rel="prettyPhoto". Code <a href="http://movies.apple.com/movies/wb/terminatorsalvation/terminatorsalvation-tlr3_h.480.mov?width=480&height=204" rel="prettyPhoto[trailers]">Трейлер №1</a> И после ссылки инициализируем скрипт таким вот образом: Code <script type="text/javascript" charset="utf-8"> $(document).ready(function(){ $("a[rel^='prettyPhoto']").prettyPhoto(); }); </script> Как я уже говорил выше можно объединить несколько видео в одном модальном окне с возможностью перехода с одного на другое специальными кнопками. Для этого достаточно в атрибуте rel="prettyPhoto" добавить в квадратных скобках ([]) общие название. Например для видео трейлеров комедий можно написать rel="prettyPhoto[comedy]". Данный плагин можно использовать практически для чего угодно (флеш, изображений, других сайтов, галлерей или всего вместе). Достаточно только добавлять необходимый атрибут к ссылкам. | |
| Категория: для ucoz | Просмотров: 532 | Добавил: explosiveua | |
| Всего комментариев: 0 | |