Меню сайта
АКЦИЯ!!!
Категории раздела
Меню [34]
Меню для сайтов на Ucoz
Кнопки [15]
Кнопки для uCoz
Блоки и формы [22]
Блоки и формы для uCoz.
Вид материалов [41]
Вид материалов для uCoz
Мини-Профили [7]
Мини-Профили для uCoz
Переключатели [29]
Переключатели страниц для uCoz
Информеры [35]
Информеры для uCoz
Плейеры для сайта [23]
Аудио, видео, радио плейеры
Слайдеры [21]
Слайдеры и карусели картинок.
Вид опросов [8]
Вид опросов для uCoz
Часы и календари [8]
Часы и календари для uCoz.
Статистика сайта [20]
Статистика сайта для uCoz
Скрипты [25]
Скрипты для uCoz
Виджеты [2]
Виджеты для uCoz
Мини-чаты [6]
Мини-чаты для uCoz
Ajax для uCoz [8]
Ajax для uCoz
Шаблоны сайтов [0]
Шаблоны и шапки для uCoz.
Анимация [3]
Анимация и анимашки для сайтов на Ucoz.
Игры [6]
Игры для uCoz.
Прочее для uCoz [18]
Прочее для uCoz.
Сервис

Translate my page
Выбрать язык / Select language:



   
веб студия Одесса создание интернет магазинов создание каталога товаров Создание сайтов раскрутка сайтов портфолио веб студии продвижение сайтов готовые дизайны сайтов наши заказчики Дизайн макеты для создания сайтов Flash игры для сайтов Мини-Чат для сайтов uCoz Вид опроса для сайта Часы и календари для сайтов дизайн сайтов-визиток онлайн радио для сайта кнопки для сайтов статистика для сайта юкоз мини-профили для сайта Полезное для сайтов переключатели страниц для сайтов ajax окна для сайтов скрипты для сайта информационные блоки для сайтов информеры для сайта Формы для Ucoz слайдер для сайта информеры для юкоз меню для сайта вид материалов для сайтов вид материалов uCoz Готовые сайты Новые Бизнес дизайн макеты Новые дизайн макеты Медицина дизайн макеты интернет магазинов Новые дизайн макеты Рестораны Новые дизайн макеты Музыка и клубы Новые дизайн макеты Отели дизайн макеты производство и услуги дизайн макеты интерьер дизайн макеты строительство дизайн макеты сельское хозяйство Новый дизайн макет Транспорт Новый дизайн макет Образование Новый дизайн макет Мода дизайн макеты компьютеры дизайн макеты мобилки Логотипы портфолио
Бесплатное отправление смс сообщений!
Поиск
Календарь
«  Август 2014  »
ПнВтСрЧтПтСбВс
    123
45678910
11121314151617
18192021222324
25262728293031
Архив записей
Наш опрос
Есть ли у Вас сайт?
Всего ответов: 27
Друзья сайта

МЕТА - Украина. Рейтинг сайтов Рейтинг@Mail.ru
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Реклама

Главная » 2014 » Август » 17

Слайдер с перелистывающим эффектом

Слайдер с эффектом перелистывания страниц, работает на jQuery с применением плагина Flux и эффектом Turn.Всё настроено для работы на сайте uCoz, он будет показывать только на динамических страницах, для работы в материале (как здесь) слайдер нужно поместь в фрейм.В местах регулировок сделаны комментарии выделенные зелёным цветом, можно включить или отключить автовоспроизведение и добавить кнопки управления сменой изображений.Имейте в виду, картинки или фотографии должны быть одного размера, сделать слайдер с автомасштабированием не получится.

Код

<script src="http://delaisait.ucoz.ru/script/js/1/2013/flux.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function(){
if(!flux.browser.supportsTransitions)
alert("Flux Slider requires a browser that supports CSS3 transitions");
window.f = new flux.slider('#dssliderturn', {
pagination: false,
controls: false, // Кнопки управления, можно (true)
transitions: ['turn'],
autoplay: true // Автозапуск, можно (false)
});
});
</script>
<div id="dssliderturn">
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img1.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img2.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img3.jpg" alt="" />
</div>
Категория: Слайдеры | Просмотров: 791 | Добавил: RedStar | Дата: 17.08.2014 | Комментарии (0)

Делаем контрастность прозрачности картинкам и тексту

Изначально рассеяная контрастность прозрачности после наведения мышкой на элемент будет восстановлена до реального состояния.Подобный эффект может быть применён к любым элементам, картинкам и тексту в частности.Скрипт работает при наличии подключенной библиотеки jQuery, на сайтах системы uCoz она подключена по умолчанию.Установка предельно проста, нужно добавить скрипт в зону HTML где он будет проявлять свой эффект и добавить элементу класс class="dscontrast" как это показано в примере для установки.Вам останется определить что будет задействовано для изменения прозрачности.

Скрипт для установки эффекта
Сам скрипт будет работать при добавлении в любую зону сайта поддерживающую HTML режим.Показана работа одновременно 2 разных тегов с подключенным классом контрастности.

Код


<script>
$(function() {
$(".dscontrast").css("opacity","0.5");
$(".dscontrast").hover(function () {
$(this).stop().animate({
opacity: 1.0
}, "contrast");
},
function () {
$(this).stop().animate({
opacity: 0.5
}, "contrast");
});
});
</script>
<img src="http://xaoc34rus.ucoz.ru/css/catsglavn.jpg" alt="demo-img" width="600" height="450" class="dscontrast" />
<p class="dscontrast">Наведя мышкой на подключенный элемент контрастная прозрачность будет изменена</p>

 

Категория: Скрипты | Просмотров: 448 | Добавил: RedStar | Дата: 17.08.2014 | Комментарии (0)

Галерея для сайта с плавной сменой изображений

Галерея чередует установленные изображения в виде картинок или фотографий предавая им эффект плавной смены.Настройки предельно просты,компановка так же не обременена километровыми значениями.Добавлены эффекты теней и округления краёв галереи, если Вам не нужны подобные эффекты можете их удалить.В местах настроек сделаны выделенные комментарии, это позволит без определённого навыка настроить галерею как нужно.

Код



<style>
#panel {
position:relative;
/* - Ширина галереи - */
width: 650px;
/* - Высота галереи - */
height: 450px;
overflow: hidden;
/* - Тени краёв галереи (можно удалить) - */
-o-box-shadow:0px 0px 7px rgba(0,0,0,0.2),  
0px 0px 0px 1px rgba(188,188,188,0.1);
box-shadow:0px 0px 7px rgba(0,0,0,0.2),  
0px 0px 0px 1px rgba(188,188,188,0.1);
/* - Округление краёв галереи (можно удалить) - */
border-radius: 8px;
-webkit-border-radius: 8px;
-o-border-radius: 8px;
-ms-border-radius: 8px;  
/* - Если удалите тени это тоже удаляйте - */
-webkit-transition:box-shadow 0.3s ease-in-out;
-moz-transition:box-shadow 0.3s ease-in-out;
-o-transition:box-shadow 0.3s ease-in-out;
transition:box-shadow 0.3s ease-in-out;
}
/* - Если удалите тени это тоже удаляйте - */
#panel:hover {
-o-box-shadow:0px 0px 9px rgba(0,0,0,0.4),  
0px 0px 0px 1px rgba(188,188,188,0.1);
box-shadow:0px 0px 9px rgba(0,0,0,0.4),  
0px 0px 0px 1px rgba(188,188,188,0.1);
}
#panel img {
position: absolute;
-ms-interpolation-mode:nearest-neighbor;
image-rendering: optimizeSpeed;
}
</style>
<script src="http://delaisait.ucoz.ru/js/gallery/dsgalery.js"></script>
<div id="panel"></div>
<div id="imgsource" style="display:none;">
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_1.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_2.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_3.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_4.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_5.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_6.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_7.jpg" />
<img src="http://delaisait.ucoz.ru/script/img/1/galerea/dsgalery_8.jpg" />
</div>

 

Категория: Слайдеры | Просмотров: 702 | Добавил: RedStar | Дата: 17.08.2014 | Комментарии (0)


Copyright "IPC" © 2008
Хостинг от uCoz