Воскресенье, 16.12.2018, 23:13
Главная  Форум Регистрация Блог RSS
Приветствую Вас, Гость
Меню сайта
Статьи про uCoz
  • Популярные азартные игры в онлайн казино
  • Как играть на деньги в интернете? Казино Три топора в интернете
  • Реальные способы зарабатывать в интернете
  • Реальный заработок в сети интернета
  • Новогодние подарки от игровых автоматов Вулкан
  • Заказываем недорогие и практичные люстры из Китая
  • Lemur Monitors предлагает системы контроля для автомобилей:  EconoDriver SafeDriver и AlertDriver
  • Блок питания для защиты компьютера
  • Meizu M6s - идеальное сочетании производительности и дизайна
  • Основные правила виртуальных турниров казино Вулкан
  • Разработка сайта
  • Что влияет на стоимость сайта?
  • Как самостоятельно создать блог без усилий
  • Как добавить карту сайта в Wordpress
  • В чем заключается SEO-продвижение сайта?
  • Продвижение ссылками – будет ли работать в 2015 году?
  • Программы обработки, сравнения и анализа прайсов
  • Комплексное продвижение сайта как основа репутационного маркетинга
  • У кого заказывать разработку сайта
  • Как создать интернет-магазин?
  • Наш опрос
    Вы посещаете сайт для ...


    Всего ответов: 1461

    установить такой вид опроса
    Статистика
    Яндекс.Метрика
    Онлайн всего: 9
    Гостей: 9
    Пользователей: 0


    Зарегистрировано 30714 (сегодня + 0 новых, вчера + 2 новых), В каталоге файлов 1128 материала(ов), Оставлено 5139 комментариев, На форуме создано тем и ответов.

    установить такую статистику

    Блок CW результаты

    Победы
    Победы(10)

    Поражения
    Поражения(5)


    Установить CW блок на свой сайт
    Внимание!
    Наш сайт адаптирован под браузер Mozilla Firefox
    скрипты для uCoz
    Скачать/Download
    В остальных браузерах наш сайт может отображаться некорректно! (IE,Opera,Google Chrome и т.д)

    установить такой блок
    Расскажи Друзьям!
    Комментарии
    Новость: Настраиваемый плеер
    Евгений написал:
    Здравствуйте. вопрос, а где архивы?
    Новость: Counter Strike скрипт мониторинга для сайта uCoz
    написал:
    http://cs-sborki.ru/cs16/6-counter-strike-16.html
    Скачать сборки CS 1.6 без рекламы по прямой ссылке или с торрента. Любая версия, любая сборка собранная игроками или блогерами. Counter-Strike 1.6 на русском языке с полной комплектацией без багов и абсолютно бесплатно.
    Здесь вы найдете для себя очень много разнообразных версий контры, с полным набором изменений, что бы разнообразить игру или классику с минимум набором или вообще оригинальную, списаную с диска.
    Скачать CS 1.6 проще чем выдумаете. Ведь это самая культовая игра в мире. Она завоевала каждого игрока, в нее попробовал играть все. Контра не зависит от мощности ПК, так как она запускается на любом, слабый или мощный, не имеет значения.
    Новость: Фотогалерея для uCoz с плавным увеличением фото (lightbox)
    Павел написал:
    ваша фотогалерея не работает на шаблонах ucoz, перепроверьте работоспособность и исправьте свои ошибки. спасибо
    Новость: Музыкальный шаблон
    eddison написал:
    doe it use file catalog or forum?

    Читать все комментарии
    Топ комментаторов

    установить такой информер
    VKONTAKTE

    FACEBOOK
    Главная страница » Помощь Вебмастеру » Категория HTML коды для uCoz » Добавлено [11.11.2013, 04:18]

    Плагин для увеличения фотографий при наведении на uCoz

    Войти или Зарегистрироваться [скачивать файлы могут только зарегистрированные пользователи!]

    Еще один легкий плагин можно положить в копилку "штучек" от Ucoz  для вашего сайта. Речь идет об очень простом, легком, но эффектном плагине, позволяющем увеличивать изображения при наведении на них.

    • Если же вы хотите посмотреть уроки создания сайта, тогда посетите портал www.for-net.ru, на котором найдёте много всего интересного на эту тему.
    Плагин легко встраивается в код страницы и требует JQuery, как и подавляющее большинство продуктов компании Ucoz. Сам плагин создан на CSS, так что можно быть уверенным, что он действительно легкий и простой в установке. После установки, изображения отлично реагируют на мышь, не просто увеличиваясь-уменьшаясь при наведении, а делая это с некоторыми эффектами. Например, если быстро перемещать мышь можно увидеть, как картинки буквально танцуют на страничке. Может для кого-то это и ничего особенного, но довольно красивый и интересный эффект привлек нас и увлек несколько минут поиграть. Вообще при быстром обращении с мышкой, картинка еще некоторое время совершает колебания - как бы подпрыгивает на месте.

    Хотя бы ради того, чтобы поиграть с рядом картинок - стоит посмотреть демку и установить на сайт - пользователи оценят - это уж точно увлечет их на длительное время, а вы получите хорошие статистические данные - сколько времени визитер задержался на странице. Это все, конечно, в шутку, но на самом деле для такого легкого плагина он содержит приятные эффекты.

    Установка:

    После /head на нужных страницах:
    <script>
    $(document).ready(function () {
    var cont_left = $("#container").position().left;
    $("a img").hover(function () {
    // hover in
    $(this).parent().parent().css("z-index", 1);
    $(this).animate({
    height: "250",
    width: "250",
    left: "-=50",
    top: "-=50"
    }, "fast");
    }, function () {
    // hover out
    $(this).parent().parent().css("z-index", 0);
    $(this).animate({
    height: "150",
    width: "150",
    left: "+=50",
    top: "+=50"
    }, "fast");
    });

    $(".img").each(function (index) {
    var left = (index * 160) + cont_left;
    $(this).css("left", left + "px");
    });
    });
    </script>

    Следующий код в самый низ вашего css:
    #main {
    background: #0099cc;
    margin-top: 0;
    padding: 2px 0 4px 0;
    text-align: center;
    }
    #main a {
    color: #ffffff;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    font-family: Arial;
    }
    #main a:hover {
    text-decoration: underline;
    }
    #container {
    text-align: center;
    position: absolute;
    width: 790px;
    }
    .img {
    position: fixed;
    z-index: 0;
    }
    .end {
    margin-right: 0;
    }
    .clear {
    clear: both;
    }
    .img a img {
    position: relative;
    border: 0 solid #fff;
    }

    Картинки оформляем следующим образом:
    <div id="container">
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="img"><a href="#"><img src="Ссылка на картинку"/></a></div>
    <div class="clear"></div>
    </div>


    При копирование материалов с сайта необходимо указать активную ссылку источника - Скрипты для uCoz 2013 и Плагин для увеличения фотографий при наведении на uCoz



    Расскажи друзьям интересные новости:


    - Установить на свой сайт блок социальных закладок
    Категория: HTML коды для uCoz | Добавил: scripts_for_ucoz | Теги: увеличения, uCoz, плагин, наведении, фотографий
    Просмотров: 6449 | Загрузок: 0 | Комментарии: 2 | Рейтинг: 0.0/0
    Всего комментариев: 1
    1 Teamist   (08.04.2014 15:28)
    tongue

    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Для добавления необходима авторизация

    Хостинг от uCoz