Понедельник, 23.06.2025, 19:59
Главная  Форум Регистрация Блог RSS
Приветствую Вас, Гость
Меню сайта
Статьи про uCoz
  • Каким компаниям сегодня часто требуются переводы на турецкий
  • Как сменить регион аккаунта для оплаты через зарубежные карты
  • Как именно сегодня люди предпочитают смотреть футбол
  • Сможет ли «Краснодар» впервые стать чемпионом РПЛ? Отзывы экспертов!
  • В Беларуси стали популярны китайские авто
  • Когда люди заказывают фуршеты на заказ с доставкой
  • Как выиграть переговоры у поставщика
  • Как выиграть переговоры у поставщика
  • Как найти работу в Самаре?
  • Кто сегодня покупает мальков белого амура?
  • Разработка сайта
  • Что влияет на стоимость сайта?
  • Как самостоятельно создать блог без усилий
  • Как добавить карту сайта в Wordpress
  • В чем заключается SEO-продвижение сайта?
  • Продвижение ссылками – будет ли работать в 2015 году?
  • Программы обработки, сравнения и анализа прайсов
  • Комплексное продвижение сайта как основа репутационного маркетинга
  • У кого заказывать разработку сайта
  • Как создать интернет-магазин?
  • Наш опрос
    Занесли наш сайт в избраное?


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

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


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

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

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

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

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


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

    установить такой блок
    Расскажи Друзьям!
    Комментарии
    Новость: Новый вид опроса на CSS by Winston888
    Денис Замятин написал:
    Епрст надо было не удалять родной код ,апросто встаыить скрипт ниже его)))))
    Новость: Новый вид опроса на CSS by Winston888
    Денис Замятин написал:
    Не найден обязательный параментр Quetions. Короче не робит
    Новость: Фото галерея для сайта укоз - модуль фотоальбомы uCoz
    Sultanbek Ajdos написал:
    Не убрать календарики правильно
    Понедельник, 22 ноября 2010 г.
    Не убрать календарики правильно
    Понедельник, 22 ноября 2010 г. Поставь правильно
    Не убрать календарики правильно
    Новость: Фото галерея для сайта укоз - модуль фотоальбомы uCoz
    Sultanbek Ajdos написал:
    Отрывные календари 2022 г.
    Карманные календарики 2010 г.
    Новость: Фото галерея для сайта укоз - модуль фотоальбомы uCoz
    Sultanbek Ajdos написал:
    Не убрать календарики правильно
    Понедельник, 22 ноября 2010 г. Поставь правильно
    Не убрать календарики правильно

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

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

    FACEBOOK
    Главная страница » Помощь Вебмастеру » Категория Скрипты для uCoz » Добавлено [10.11.2013, 22:41]

    Простой слайдер новостей и фото изображений на uCoz

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

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



    Мы сталкивались с этой проблемой и искали, наши друзья и коллеги сталкивались и искали, и наконец, перебрав много вариантов, заценив все "за и "против", мы всем миром пришли к выводу, что один из лучших и заслуживающих внимания в этом случае - продукт Ucoz - самый легкий слайдер просмотра изображений. Написан традиционно с использованием JQuery. Вообще, любителям плагинов от Ucoz советуем следить за выходом новых версий библиотек JQuery, так как подавляющее большинство продуктов требуют их и только их. Скрипт подразумевает простое оформление и навигацию - с помощью мыши можно переключать изображения в любой последовательности. Оформление подходит для сайтов любой тематики и не имеет каких-то особенных элементов управления и навигации. Смена картинок происходит плавно, без рывков. Очень позитивное впечатление оставил легкий слайдер, так что всем советуем.

    Важно: Скрипты из прикреплённого архива залейте в папку js

    Установка:

    После /head на нужных страницах вставляйте:
    <script src="/js/jquery.scrollTo.js"></script>
    <script src="/js/jquery.localscroll.js"></script>
    <script src="/js/scripts.js"></script>

    Следующий код в самый низ вашего css:

    #slideshow {
    width: 918px;
    height: 546px;
    overflow-x: scroll;
    overflow-y: hidden;
    margin: 100px auto 50px auto;
    box-shadow: 0px 0px 80px #000;
    -moz-box-shadow: 0px 0px 80px #000;
    -webkit-box-shadow: 0px 0px 80px #000;
    }
    #slideshow ul {
    width: 4590px;
    list-style: none;
    }
    #slideshow ul li {
    float: left;
    }
    #slideshow-nav {
    width: 300px;
    margin: 0 auto 200px auto;
    visibility: hidden;
    }
    #slideshow-nav ul {
    list-style: none;
    }
    #slideshow-nav ul li {
    float: left;
    }
    #slideshow-nav ul li a {
    display: block;
    width: 30px;
    height: 30px;
    float: left;
    margin: 0 10px;
    background-color: #fff;
    text-indent: -9999px;
    border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    box-shadow: 0px 0px 30px #000;
    -moz-box-shadow: 0px 0px 30px #000;
    -webkit-box-shadow: 0px 0px 30px #000;
    }
    #slideshow-nav ul li a:hover, #slideshow-nav ul li a.active {
    background-color: #a89d8a;
    }
    a {
    outline: none;
    }
    a:focus {
    background-color: #a89d8a;
    }

    Далее в то место, где должен быть слайдер, вставляйте:
    <div id="slideshow">
    <ul>
    <li id="img1">
    <a>
    <img src="Ссылка на картинку 1" />
    </a>
    </li>
    <li id="img2">
    <a>
    <img src="Ссылка на картинку 2" />
    </a>
    </li>
    <li id="img3">
    <a>
    <img src="Ссылка на картинку 3" />
    </a>
    </li>
    <li id="img4">
    <a>
    <img src="Ссылка на картинку 4" />
    </a>
    </li>
    <li id="img5">
    <a>
    <img src="Ссылка на картинку 5" />
    </a>
    </li>
    </ul>
    </div>

    <div id="slideshow-nav">
    <ul>
    <li><a href="#img1">Пункт 1</a></li>
    <li><a href="#img2">Пункт 2</a></li>
    <li><a href="#img3">Пункт 3</a></li>
    <li><a href="#img4">Пункт 4</a></li>
    <li><a href="#img5">Пункт 5</a></li>
    </ul>
    </div>



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



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


    - Установить на свой сайт блок социальных закладок
    Категория: Скрипты для uCoz | Добавил: scripts_for_ucoz | Теги: изображений, фото, Простой, новостей, ucoz, слайдер
    Просмотров: 15401 | Загрузок: 289 | Комментарии: 5 | Рейтинг: 0.0/0
    Всего комментариев: 5
    5 admin5380   (30.12.2021 20:20) [Материал]
    Скажите, пожалуйста, а где прикрепленный архив со скриптами?

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

    По вопросам сотрудничества и рекламы пишите на почту rusalex11@live.com Хостинг от uCoz