Сообщений в теме: 13

[Olga89]

Здравствуйте.
На аккаунте  SL-303199   хочу сделать такой же эффект появляющегося текста на слайдере,
как на аккаунте SL-303200


{% IF index_page %}
  <div class="fluid-container">
<div class="camera_wrap camera_black_skin" id="camera_wrap_1">
  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
<div class="camera_caption moveFromLeft">
  Яркое решение в области рекламы!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
<div class="camera_caption moveFomRight">
  Подберем то, что нужно!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
<div class="camera_caption moveFromLeft">
  Современный подход, стильное решение!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
<div class="camera_caption moveFomRight">
      Яркая реклама, которая приносит прибыль!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide5.jpg" data-src="{ASSETS_IMAGES_PATH}slide5.jpg">
<div class="camera_caption fadeFromRight">
  Экономьте сейчас! Промышленные и офисные светильники OPPLE!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
<div class="camera_caption fadeFromLeft">
  Рекламный инструмент, который работает!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
<div class="camera_caption fadeFromRight">
  Хит клубного стиля!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
<div class="camera_caption fadeFromLeft">
  Фасад, который приносит прибыль!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
<div class="camera_caption fadeFromRight">
  Расскажи о себе всему городу!
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide5.jpg" data-src="{ASSETS_IMAGES_PATH}slide5.jpg">
<div class="camera_caption fadeFromRight">
  Большие счета за свет? Промышленные и офисные светильники OPPLE!
</div>
  </div>



То есть под каждый слайд прописывается всплывающий текст. Возможно добавить тоже самое для nivo на второй аккаунт?

[Vaccina]

В шаблоне HTML найдите слайды и добавьте к картинкам title, пример:

<img src= "http://ledv.storeland.net/%D1%81%D0%BB%D0%B0%D0%B9%D0%B41.jpg" alt="" title="Пример картинки с заголовком"  />

[Olga89]

Vaccina (09 Сентябрь 2014 - 03:59) писал:

В шаблоне HTML найдите слайды и добавьте к картинкам title, пример:

<img src= "http://ledv.storeland.net/%D1%81%D0%BB%D0%B0%D0%B9%D0%B41.jpg" alt="" title="Пример картинки с заголовком" />

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

[Vaccina]

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

[Olga89]

Vaccina (10 Сентябрь 2014 - 03:47) писал:

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

Прошу прощения, постоянно дорабатываю сайт, постоянно пересохраняю. А можно поменять слайдер "nyvo"  на  "camera"  как на аккаунте SL-303200    ?

[Olga89]

Прошу прощения, постоянно дорабатываю сайт, постоянно пересохраняю. А можно поменять слайдер "nyvo"  на  "camera"  как нааккаунте SL-303200 ?

[Ирина345]

Olga89 (10 Сентябрь 2014 - 10:28) писал:

Прошу прощения, постоянно дорабатываю сайт, постоянно пересохраняю. А можно поменять слайдер "nyvo"  на  "camera"  как нааккаунте SL-303200 ?

Здравствуйте, для того что бы установить слайдер camera. скачайте файл camera.min.zip
и добавить содержимое файла на сайт
Далее найдите в HTML  код

</head>

и перед ним добавьте код

{% IF index_page %}
<link rel="stylesheet" type="text/css" href="{ASSETS_STYLES_PATH}camera.css">
<script type='text/javascript' src='{ASSETS_JS_PATH}camera.min.js'></script>
<script>
jQuery(function(){
jQuery('#camera_wrap_1').camera({
minHeight: '400px',
maxHeight: '600px',
pagination: false,
thumbnails: false,
time: 3000
});
});
</script>
{% ENDIF %}

далее найдите

<div id="topobj"></div>

и замените на

<div id="topobj"></div>

<!-- Главная страница -->
{% IF index_page %}
<div class="fluid-container">
<div class="camera_wrap camera_black_skin" id="camera_wrap_1">
<div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
<div class="camera_caption moveFromLeft">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>
<div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
<div class="camera_caption moveFomRight">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>
<div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
<div class="camera_caption moveFromLeft">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>

<div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
<div class="camera_caption fadeFromLeft">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>
<div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
<div class="camera_caption fadeFromRight">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>
<div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
<div class="camera_caption fadeFromLeft">
Мечты становятся реальностью, когда мысли превращаются в действия!
</div>
</div>

</div><!-- #camera_wrap_1 -->
<div class="clear"></div>
</div><!-- .fluid_container -->

{% ENDIF %}
<script type='text/javascript' src='{ASSETS_JS_PATH}camera.min.js'></script>
<script>
jQuery(function(){
jQuery('#camera_wrap_1').camera({
minHeight: '400px',
maxHeight: '600px',
pagination: false,
thumbnails: false,
time: 3000
});
});
</script>

<!-- Главная страница -->

Так же нужно добавить на сайт картинки с именами slide1.jpg slide2.jpg slide3.jpg

Прикрепленные файлы

•  camera.min.zip   18,46К   123 Количество загрузок:

[Olga89]

А можно сделать так, чтобы этот слайдер был такого же размера как и nivo  на том же месте?

[Ирина345]

Olga89 (10 Сентябрь 2014 - 11:51) писал:

А можно сделать так, чтобы этот слайдер был такого же размера как и nivo  на том же месте?

Вставьте непосредственно код слайдера в html
после строчки

<div id="cntrobj">

[Olga89]

Кажется я что-то делаю не так. На фото показано то, что есть сейчас и то, что я хочу. И фотографии получились обрезанными.

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

• 
• 

[Ирина345]

Olga89 (10 Сентябрь 2014 - 13:02) писал:

Кажется я что-то делаю не так. На фото показано то, что есть сейчас и то, что я хочу. И фотографии получились обрезанными.

Найдите в HTML

<div class="fluid-container">

замените на

<div class="fluid-container" style="width: 98%;margin: 0 auto;margin-bottom: 12px;">

[Olga89]

Спасибо.

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

2. И подскажите пожалуйста, какого размера должны быть слайды? Сейчас они как бы обрезаны. У меня они размером 976х415

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

• 

[Ирина345]

Olga89 (11 Сентябрь 2014 - 07:58) писал:

Спасибо.

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

2. И подскажите пожалуйста, какого размера должны быть слайды? Сейчас они как бы обрезаны. У меня они размером 976х415

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

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

• 

[Olga89]

Ирина345 (11 Сентябрь 2014 - 11:16) писал:

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

Спасибо