Перейти к содержимому


Вертикальные Слайдеры

Автор M4RQ, 09 окт. 2013 13:26
вертикальные слайдеры слайдеры вертикальный слайдер слайдер помощь АХТУНГ

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 50

#21 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 10 Октябрь 2013 - 20:34

еще раз. ОЧЕНЬ ЖДУ ПОМОЩИ, СРОЧНО
Мне нужно этот макет к завтрашнему дню доделать, а я не знаю как

#22 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 11 Октябрь 2013 - 01:21

У вас заданы некорректные пути к изображениям. Все изображения которые вы указали в карусели (1.jpg, 2.jpg, 3.jpg...) необходимо загрузить в раздел редактора тем или же задать корректные пути к изображениям в случае если они у вас уже загружены.

#23 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 11 Октябрь 2013 - 12:13

Просмотр сообщенияVaccina (11 Октябрь 2013 - 01:21) писал:

У вас заданы некорректные пути к изображениям. Все изображения которые вы указали в карусели (1.jpg, 2.jpg, 3.jpg...) необходимо загрузить в раздел редактора тем или же задать корректные пути к изображениям в случае если они у вас уже загружены.
Загрузил все изображения, тоже самое.
Ходил по сайту, заметил следуещее -
Анимация у "Товаров, которые смотрели до этого" работает неправильно.
На странице товара появились части слайдера
Стрелки не на том месте где надо
КАК ИСПРАВИТЬ?

#24 Stasya

Stasya

    Активный участник

  • Модератоpы
  • 4 007 сообщений

Отправлено 11 Октябрь 2013 - 12:30

В файле skin.css найдите блок 
.jcarousel-skin-tango .jcarousel-next-vertical {
position: absolute;
bottom: 5px;
left: 63px;
width: 32px;
height: 32px;
cursor: pointer;
background: transparent url(../images/next-vertical.png) no-repeat 0 0;
}
и замените его на
.jcarousel-skin-tango .jcarousel-next-vertical {
position: absolute;
bottom: 5px;
left: 63px;
width: 32px;
height: 32px;
cursor: pointer;
background: transparent url(../images/next-vertical.png) no-repeat 0 0;
top: 345px;
}

В шаблоне HTML  найдите блок 
<ul id="mycarousel1" class="jcarousel jcarousel-skin-tango">
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
</ul>
	 <!-- Nyvo слайдер который отображается на главной -->
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://st.basketland.ru/1/808/848/2.png" alt="" />
<img src="http://st.basketland.ru/1/808/849/3.png" alt="" />
<img src="http://st.basketland.ru/1/808/850/4.png" alt="" />
<img src="http://st.basketland.ru/1/808/851/5.png" alt="" />
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>
{% ENDIF %}
	 </div>
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-750x;">
		 <div class="jcarousel-container jcarousel-container-vertical" style="position: relative; display: block;">
		 <div class="jcarousel-clip jcarousel-clip-vertical" style="overflow: hidden; position: relative;">
		 <ul id="mycarousel2" class="jcarousel jcarousel-skin-tango">
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
</ul>
</div>
<div class="jcarousel-prev jcarousel-prev-vertical jcarousel-prev-disabled jcarousel-prev-disabled-vertical" disabled="disabled" style="display: block;"></div>
<div class="jcarousel-next jcarousel-next-vertical" style="display: block;"></div>
</div>
</div>
и замените его на 
{% IF index_page %}
<ul id="mycarousel1" class="jcarousel jcarousel-skin-tango">
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
<li><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></li>
</ul>
	 <!-- Nyvo слайдер который отображается на главной -->
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://st.basketland.ru/1/808/848/2.png" alt="" />
<img src="http://st.basketland.ru/1/808/849/3.png" alt="" />
<img src="http://st.basketland.ru/1/808/850/4.png" alt="" />
<img src="http://st.basketland.ru/1/808/851/5.png" alt="" />
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>

	 </div>
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-750x;">
		 <div class="jcarousel-container jcarousel-container-vertical" style="position: relative; display: block;">
		 <div class="jcarousel-clip jcarousel-clip-vertical" style="overflow: hidden; position: relative;">
		 <ul id="mycarousel2" class="jcarousel jcarousel-skin-tango">
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
</ul>
</div>
<div class="jcarousel-prev jcarousel-prev-vertical jcarousel-prev-disabled jcarousel-prev-disabled-vertical" disabled="disabled" style="display: block;"></div>
<div class="jcarousel-next jcarousel-next-vertical" style="display: block;"></div>
</div>
</div>	
{% ENDIF %}

#25 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 11 Октябрь 2013 - 12:45

надеюсь поможет.

#26 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 11 Октябрь 2013 - 13:04

все равно не так!

Прикрепленные изображения

  • Безымянный.png

#27 Stasya

Stasya

    Активный участник

  • Модератоpы
  • 4 007 сообщений

Отправлено 11 Октябрь 2013 - 13:42

Вы оставили лишний блок 
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-750x;">
		 <div class="jcarousel-container jcarousel-container-vertical" style="position: relative; display: block;">
		 <div class="jcarousel-clip jcarousel-clip-vertical" style="overflow: hidden; position: relative;">
		 <ul id="mycarousel2" class="jcarousel jcarousel-skin-tango">
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
<li><a href="http://basketland.ru/goods/JORDAN-23-AWAY-JERSEY"><img src="{ASSETS_IMAGES_PATH}jpg.jpg" width="200" height="200" alt="" /></a>
</ul>
</div>
<div class="jcarousel-prev jcarousel-prev-vertical jcarousel-prev-disabled jcarousel-prev-disabled-vertical" disabled="disabled" style="display: block;"></div>
<div class="jcarousel-next jcarousel-next-vertical" style="display: block;"></div>
</div>
</div>


Удалите его с 545 строки.

Далее найдите блок 
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-750x;">
и замените его на 
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-489px;margin-right:-82px;">

#28 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 11 Октябрь 2013 - 19:48

Спасибо!
Последний вопрос - как сделать так, чтобы они автоматически переключались?

И убрать стрелочки

#29 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Октябрь 2013 - 01:38

Удалите:
<div class="jcarousel-prev jcarousel-prev-vertical jcarousel-prev-disabled jcarousel-prev-disabled-vertical" disabled="disabled" style="display: block;"></div>
<div class="jcarousel-next jcarousel-next-vertical" style="display: block;"></div>
Далее
directionNav: true, // Next & Prev navigation
замените на:
directionNav: false, // Next & Prev navigation
и ниже этой строки добавьте:
auto: 2,

#30 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 13 Октябрь 2013 - 18:51

Просмотр сообщенияVaccina (12 Октябрь 2013 - 01:38) писал:

Удалите:
<div class="jcarousel-prev jcarousel-prev-vertical jcarousel-prev-disabled jcarousel-prev-disabled-vertical" disabled="disabled" style="display: block;"></div>
<div class="jcarousel-next jcarousel-next-vertical" style="display: block;"></div>
Далее
directionNav: true, // Next & Prev navigation
замените на:
directionNav: false, // Next & Prev navigation
и ниже этой строки добавьте:
auto: 2,
получилось так, что слайдер на разных мониторах отображается по разному. у меня он стоит ровно, а у друга - криво. как исправить.

#31 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 13 Октябрь 2013 - 19:16

также как сделать так, чтобы слайдер не останавливался а продолжал идти по кругу.

#32 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 13 Октябрь 2013 - 20:06

ап

#33 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 14 Октябрь 2013 - 09:09

Просмотр сообщенияM4RQ (13 Октябрь 2013 - 20:06) писал:

ап

у Вас сейчас так и работает слайдер.

#34 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 14 Октябрь 2013 - 10:18

Просмотр сообщенияmiyako (14 Октябрь 2013 - 09:09) писал:

у Вас сейчас так и работает слайдер.
как сделать так, чтобы он не отстанавливался в конце, а переходил в начало автоматически.
И он съезжает на разных мониторах.

#35 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 14 Октябрь 2013 - 14:23

Просмотр сообщенияM4RQ (14 Октябрь 2013 - 10:18) писал:

как сделать так, чтобы он не отстанавливался в конце, а переходил в начало автоматически.
И он съезжает на разных мониторах.
Здравствуйте, сейчас ваш слайдер работает корректно, после четвертого слайда показывает снова первый и т.д. Возможно, Вы имели в виду что-то другое?

#36 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 14 Октябрь 2013 - 14:38

Просмотр сообщенияne_yana (14 Октябрь 2013 - 14:23) писал:

Здравствуйте, сейчас ваш слайдер работает корректно, после четвертого слайда показывает снова первый и т.д. Возможно, Вы имели в виду что-то другое?
я имею в виду боковые слайдеры.

но больше всего меня волнует размещение правого слайдера

#37 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 14 Октябрь 2013 - 17:38

помогите.

#38 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 14 Октябрь 2013 - 17:45

Просмотр сообщенияM4RQ (14 Октябрь 2013 - 14:38) писал:

я имею в виду боковые слайдеры.

но больше всего меня волнует размещение правого слайдера

Добрый вечер, найдите в разделе Сайт - Редактор шаблонов - HTML замените
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-459px;">
на
<div class=" jcarousel-skin-tango" style="float:right;margin-top: -489px;">

#39 M4RQ

M4RQ

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 62 сообщений

Отправлено 14 Октябрь 2013 - 18:10

Просмотр сообщенияne_yana (14 Октябрь 2013 - 17:45) писал:

Добрый вечер, найдите в разделе Сайт - Редактор шаблонов - HTML замените
<div class=" jcarousel-skin-tango" style="float:right;margin-top:-459px;">
на
<div class=" jcarousel-skin-tango" style="float:right;margin-top: -489px;">
Сделал как сказали - получается не так:

Прикрепленные изображения

  • Безымянный.png

#40 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 14 Октябрь 2013 - 18:27

Просмотр сообщенияM4RQ (14 Октябрь 2013 - 18:10) писал:

Сделал как сказали - получается не так:

Тогда измените цифру -489 на ваше усмотрение. К сожалению, более точно не могу сейчас ответить, так как не получается зайти сейчас на ваш сайт.
Обратно в Изменение общей стилистики



Темы с аналогичным тегами вертикальные слайдеры, слайдеры, вертикальный слайдер, слайдер, помощь, АХТУНГ

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Вопросы общие для всех шаблонов
  5. → Изменение общей стилистики
  6. Privacy Policy