Страница 1 из 11
Модератор форума: JonMagon 
Сообщество uCoz » Вебмастеру » JavaScript, Flash и прочие технологии » jQuery » Помогите оживить слайдер
Помогите оживить слайдер
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 1 | 13:32:07
Страница: http://tokio30.ru/index/set_kafe/0-38
Уже который день бьюсь со слайдером, не пашет. Прошу помочь его оживить. Может кто свежим взглядом посмотрит, а то я уже замучился. Первоначально слайдер нашел тут:http://bxslider.com
webanet
Личный менеджер
Сообщений: 23032
Репутация: 4867

Сообщение # 2 | 18:25:41
nikozavr, вот эти три библиотеки лишние
Код
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="http://tokio30.ru/avatar/sl/jquery.min.js"></script>
<script type="text/javascript" src="http://tokio30.ru/avatar/sl/jquery-1.7.2.min.js"></script>
они конфликтуют и между собой и системной
остальное все хорошо, но вы забыли самое главное - это подключение картинок
Цитата
<ul class="bxslider">
<li><img src="/images/pic1.jpg" /></li>
<li><img src="/images/pic2.jpg" /></li>
<li><img src="/images/pic3.jpg" /></li>
<li><img src="/images/pic4.jpg" /></li>
</ul>

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

ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 3 | 18:52:33
Спасибо. Библиотеки убрал, сейчас попробую с картинками разобраться.

Добавлено (29 Авг 2015, 18:52:33)
---------------------------------------------
Стопю Не понял.
Вот мой код слайдера:

<div id="homeslider">
<div class="bx-wrapper" style="max-width: 996px; margin: 0px auto;"><div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 301px;"><ul style="width: auto; position: relative;">

<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0; display: none;"><img src="http://tokio30.ru/avatar/sl/slide1.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0; display: list-item; opacity: 1;"><img src="http://tokio30.ru/avatar/sl/tokio1.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 51; display: list-item; opacity: 0;"><img src="http://tokio30.ru/avatar/sl/slide3.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0; display: none;"><img src="http://tokio30.ru/avatar/sl/slide4.jpg"></li>
</ul></div></div>

Путь к картинкам прописан. Куда вставить подключение стилей?
<ul class="bxslider">

webanet
Личный менеджер
Сообщений: 23032
Репутация: 4867

Сообщение # 4 | 19:11:00
вот так попробуйте
Код
<div id="homeslider">
<div class="bx-wrapper" style="max-width: 996px; margin: 0px auto;"><div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 301px;"><ul class="bxslider; style="width: auto; position: relative;">

<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0;"><img src="http://tokio30.ru/avatar/sl/slide1.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0; opacity: 1;"><img src="http://tokio30.ru/avatar/sl/tokio1.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 51; display: list-item; opacity: 0;"><img src="http://tokio30.ru/avatar/sl/slide3.jpg"></li>
<li style="float: none; list-style: none; position: absolute; width: 996px; z-index: 0;"><img src="http://tokio30.ru/avatar/sl/slide4.jpg"></li>
</ul></div></div>

ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 5 | 19:19:33
Блин, не работает....Что же такое?

Добавлено (29 Авг 2015, 19:19:33)
---------------------------------------------
http://tokio30.ru/index/set_kafe/0-38

webanet
Личный менеджер
Сообщений: 23032
Репутация: 4867

Сообщение # 6 | 19:35:49
nikozavr, пропишите чистые ссылки к картинкам
Код
<ul class="bxslider" style="width: auto; position: relative;">
   
  <li><img src="http://tokio30.ru/avatar/sl/slide1.jpg"></li>
  <li><img src="http://tokio30.ru/avatar/sl/tokio1.jpg"></li>
  <li><img src="http://tokio30.ru/avatar/sl/slide3.jpg"></li>
  <li ><img src="http://tokio30.ru/avatar/sl/slide4.jpg"></li>
  </ul>

ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 7 | 19:55:43
webanet, так тоже не работает!!
webanet
Личный менеджер
Сообщений: 23032
Репутация: 4867

Сообщение # 8 | 19:58:24
nikozavr,
Код
<body contenteditable="true">
если вы пользуетесь визуальным редактором для правки кода, то ничего работать не будет. я не говорила, что нужен визуальный редактор. а как вставить слайдер с помощью визуалки я не знаю

ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 9 | 20:15:59
Я редактирую коды через управление дизайном, редактор шаблонов, редактор страниц.
А чем надо пользоваться чтобы работал?

Добавлено (29 Авг 2015, 20:15:59)
---------------------------------------------
webanet, насчет визуального я понял - раз попробовал через него текст на главной отредактировать. Появилось это <body contenteditable="true">,
я убрал. А обычно я код правлю в редакторе страниц.

webanet
Личный менеджер
Сообщений: 23032
Репутация: 4867

Сообщение # 10 | 20:35:27
nikozavr, найдите теперь скрипт
Код
<script type="text/javascript" >

  $(document).ready(function(){
  $('.bxslider').bxSlider();
});
  </script>

и замените на это
Код
<script type="text/javascript" >

  $(document).ready(function(){
$('.bxslider').bxSlider({
   auto: true,
   autoControls: true
   });
  });</script>

ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/
nikozavr
Сообщений: 18
Репутация: 10

Сообщение # 11 | 20:47:43
УРРА! Заработало!!!!!!!!!!! Спасибо! Плюс уже поставил а так бы еще добавил в репутацию!
Вот ведь блин.

Добавлено (29 Авг 2015, 20:47:43)
---------------------------------------------
А есть код для скрипта, чтобы картинки не сменяли друг друга наезжая слева на право, а чтобы перетекали одна в другую?

Criminalist
Сообщений: 2
Репутация: 0

Сообщение # 12 | 16:56:29
Господа, помогите в адаптации слайдера. Я полный ноль в jQuery. Буду очень признателен. Вот ссылка на сайт, где находится нужный мне слайдер:
http://demo.seventhemes.com/visario/
Admin6279
Сообщений: 1
Репутация: 0

Сообщение # 13 | 13:21:25
Здравствуйте, не получается подключить данную галерею на сайте http://pcvector.net/scripts/slideshow_and_scroller/455-unitgallery-mnogofunkcionalnaya-adaptivnaya-galereya.html. Все необходимые скрипты загрузил. В дизайне глобального блока прописал пути к скриптам и css. А на самой странице сделал так как показано. Но ничего не работает. Если открыть страницу с примером, которую я тоже залил на сайт, то там все работает. В чем может быть дело. Может конфликт с внутренними скриптами ucoz?

Добавлено (06 Апр 2017, 13:21:25)
---------------------------------------------

Цитата Admin6279 ()
Здравствуйте, не получается подключить данную галерею на сайте http://pcvector.net/scripts/slideshow_and_scroller/455-unitgallery-mnogofunkcionalnaya-adaptivnaya-galereya.html. Все необходимые скрипты загрузил. В дизайне глобального блока прописал пути к скриптам и css. А на самой странице сделал так как показано. Но ничего не работает. Если открыть страницу с примером, которую я тоже залил на сайт, то там все работает. В чем может быть дело. Может конфликт с внутренними скриптами ucoz?
Все разрешил. Оказывается исходный скрипты нужно было подключать перед закрывающимся тегом </body> в дизайнере
Сообщество uCoz » Вебмастеру » JavaScript, Flash и прочие технологии » jQuery » Помогите оживить слайдер
Страница 1 из 11
Поиск: