посмотреть оригинал
Как вставить 3D флеш галерею без специальных программ на вашу открытку.Эту осеннюю открытку мы сделали на МАСТЕР-КЛАССЕ "Золотая осень" в самом простом бесплатном конструкторе SharePoint Designer 2007. Это обыкновенный html-редактор, в котором можно создавать html-страницы.
Музыкальная открытка - это такая же html-страница. Преимущество данного редактора в том, что кроме самого кода страницы вы видите, как страница будет отображаться в браузере. Поэтому не обязательно разбираться во всех этих кодах, достаточно иметь о них общее представление.
Мы воспользуемся готовым шаблоном. Для этого
Распакуйте ее и перенесите из нее в свою папку с открыткой все файлы кроме файла shablon.html:
Чтобы одновременно выделить несколько папок или файлов необходимо зажать клавишу Ctrl.
Из файла shablon.html мы будем переносить части кода в нашу открытку. Самое главное понимать, что необходимо скопировать и куда вставить.
3D флеш галерея это скрипт, который вставляется в виде кода в вашу открытку. Кроме кода нам понадобятся изображения, которые находятся в папке images. Названия этих изображений прописаны в документе default.XML:
Открыть этот документ можно, как с помощью SharePoint Designer:
А также, как самый обыкновенный текстовый документ:
Для того, чтобы в 3D флеш галерее отобразились те изображения, которые вы хотите, либо загрузите в папку images изображения с такими же названиями, которые уже есть в папке, либо загрузив свои изображения в эту папку с другими названиями, пропишите эти названия в файле default.XML.
Обратите внимание на расширение файла которое прописано в документе default.XML:
В данном случае расширение у всех файлов PNG. Если у вас изображения с другим расширением, например jpg, правильно пропишите все это в документе default.XML, либо поменяйте само расширение в изображениях.
Также при загрузке изображений обратите внимание на размер самих изображений. в данном случае их размер: 400х267 px. Можете сделать их немного крупнее. Не забывайте. что размер самой флеш, которая прописана в коде: 750x500.
Вы можете уменьшить или увеличить количество изображений в карусели, добавив или удалив изображения из папки images. Главное, пропишите добавленные изображения в файле default.XML:
После этого переходим к самой открытке. В него мы будем переносить код по частям из файла shablon.html. Откройте его с помощью SharePoint Designer и скопируйте в html код вашей открытки (в моем случае это index.html) строчку между <head></head> :
<script type="text/javascript" src="swfobject.js"></script>
и вставьте ее также между этими тегами в своей открытке:
(можно просто перед закрывающимся </head>
Перед закрывающимся тегом </bodi> необходимо скопировать и вставить в вашу открытку следующую часть кода:
<script type="text/javascript">
swfobject.embedSWF("Flip.swf", "flip1", "750", "500", "10.0.0", false, {xmlfile:"default.xml", loaderColor:"0x666666"}, {wmode: "transparent"});
</script>
Теперь остается скопировать последнюю часть кода - контейнер с каруселью, который находится между тегами <div></div>:
<div class="flip_container">
<div id="flip1">
</div>
</div>
Его необходимо вставить в ту часть открытки, где вы хотите разместить саму 3D флеш галерею. Я решила его поместить сразу после названия:
Сохраняем наш файл html, нажимаем предпросмотр, и если все сделано правильно, наслаждаемся просмотром. Что интересно, это флеш-анимация управляется курсором - ее можно замедлить или заставить крутиться в другую сторону!
По этому же принципу вы можете сделать другую 3D флеш галерею.
Вот как она будет выглядеть: https://internet-ledi.ru//osen
Принцип переноса тот же. Также переносятся файлы и добавляется код в открытку. Скачать шаблон 2 варианта карусели можно.
Только первую часть кода между тегами <head></head> необходимо скопировать из файла sablon2.html вместе со стилем, иначе эта карусель не будет отображаться (в первом случае тоже был стиль, я его убрала и это никаким образом не отобразилось на открытке):
<script type="text/javascript" src="swfobject.js"></script>
<style type="text/css">
html, body {}
.carousel_container {
width: 750px;
height: 500px;
}
</style>
Все остальные части кода переносятся таким же образом, как описано в предыдущем случае. Не забывайте, если вы меняете названия изображений при загрузке или добавляете новые, прописывать их в файле default.XML.
Хочу напомнить, что осенний марафон только набирает обороты, судя по тому, что участники только начинают добавляться. Вы тоже можете стать участником конкурса на лучшую музыкальную открытку -
https://internet-ledi.ru//zolotaya_osen/marafon.html
Напишите в комментариях, получилось ли вам установить 3D карусель на свою открытку? 3D флеш галерея используется не только для открыток, но и для любых сайтов, ведь самое главное - это содержание, и то, как оно представлено! Например, с помощью флеш-галереи можно сделать небольшое портфолио для своих работ, чтобы они компактно располагались на сайте.
Добавить комментарий