Форум Сайтостроение Веб-строительство

Добавление эффекта плавной смены изображений в слайдер

Ben_Laden
На сайте с 26.03.2011
Offline
92
Ben_Laden
2294

Добрый вечер!

Есть на сайте слайдер, с обычным эффектом перелистывания влево.

Стала у меня задача заменить эффект на плавное появление картинки и исчезание.

Стоит ли из за этого ставить другой слайдер, и может где можно найти кусок кода который можно добавить к уже существующему JS ??

Сайт делали сторонние люди, по этому, если я не ошибаюсь, тогда вод JS который крутит изображения:

Буду благодарен за любые, намеки, где копать !! 

/*js init*/

$(document).ready(function(){

	var homeurl = ORIG_URL;

	$('.header_logo, .footer_copy_name').click(function(){window.location = homeurl;});

	if ($(".scrollable.autoscroll .lst .item").length) {

		$(".scrollable.autoscroll").scrollable({vertical: false, circular:true, speed:400, clonedClass:'cloned'}).autoscroll({interval:10000,steps:1,autopause:true});

	}

	if ($(".scrollable.navigator .lst .item").length) {

		$(".scrollable.navigator").scrollable({vertical: false, circular:true, speed:400, clonedClass:'cloned'}).autoscroll({interval:10000,steps:1,autopause:true}).navigator();

	}

});

А в файл HTML вставлен такой код: 

<div class="banners_scroll_wrp">

			<div class="clr"></div>

			<div class="scrollable navigator">

				<div class="lst">

					{section name=i loop=$banners}

						<div class="item">	

							{if $banners.is_image}

								{if $banners.url}

									<a class="imgwrp" href="{$banners.url}" title="{$banners.name}">

								{/if}

									<img src="{$smarty.const.WBS_INSTALL_PATH}images/promo/{$banners.src}">

								{if $banners.url}

									</a>

								{/if}

							{/if}

						</div>

					{/section}

				</div>

			</div>

			<div class="navi"></div>

		</div>
дани мапов
На сайте с 06.09.2012
Offline
204
дани мапов
#1

Это не весь код, тут просто идет вызов плагина с параметрами, скорее всего код плагина в отдельном файле: 


$(".scrollable.autoscroll").scrollable({vertical: false, circular:true, speed:400, clonedClass:'cloned'}).autoscroll({interval:10000,steps:1,autopause:true});
Написание и доработка скриптов (PHP, MySQL, JavaScript, jQuery) (/ru/forum/811046)
Ben_Laden
На сайте с 26.03.2011
Offline
92
Ben_Laden
#2
дани мапов:
Это не весь код, тут просто идет вызов плагина с параметрами, скорее всего код плагина в отдельном файле: 

$(".scrollable.autoscroll").scrollable({vertical: false, circular:true, speed:400, clonedClass:'cloned'}).autoscroll({interval:10000,steps:1,autopause:true});

по каким же признакам его можно отыскать, не знаете?

---------- Добавлено 21.10.2013 в 20:50 ----------

Нашел нужный код, оказалось он связан и с другими скролами, не слайдером, видимо придется ставить новый слайдер!!

Тему можно закрыть, Спасибо!

Резкий всплеск прямых заходов. Как сделать слайдер для Яндекс не видит ботов
Ben_Laden
На сайте с 26.03.2011
Offline
92
Ben_Laden
#3

вернусь к теме, пришел к плагину jQuery Cycle.

все подключил настроил, но есть одна ошибка,

Uncaught TypeError: Object #<Object> has no method 'cycle'

из за этого я полагаю и не работает, такой кусок кода ставлю в head: 

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>



     {literal}<script type="text/javascript">jQuery.noConflict();</script>{/literal}



    <script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>

    <script type="text/javascript" src="js/jquery.easing.1.1.1.js"></script>

    

{literal}<script type="text/javascript">

$('#lst_new').cycle({ 

    fx:      'fade',

	next: '#next_slide',

	prev: '#prev_slide',

    timeout:  0

}); 

</script>{/literal}

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

Uncaught TypeError: Property '$' of object [object Object] is not a function

В чем может быть проблема, как же это все поправить ???

jpg Untitle343d-1.jpg
Ben_Laden
На сайте с 26.03.2011
Offline
92
Ben_Laden
#4

убрал {literal}<script type="text/javascript">jQuery.noConflict();</script>{/literal}

Изображения в слайдере начали переключатся только по клику.

но появились конфликты с плагином highslide, не открываются изображения

такие ошибки:

jpg 53454353453435687868.jpg
Ben_Laden
На сайте с 26.03.2011
Offline
92
Ben_Laden
#5
Ben_Laden:
убрал {literal}<script type="text/javascript">jQuery.noConflict();</script>{/literal}

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

такие ошибки:

Кто может знает как эти конфликты разрулить, помогите пожалуйста!!

---------- Добавлено 21.10.2013 в 23:52 ----------

немного лучше стало, все скрипты на сайте работают

Слайдер, при кликах на кнопки вперед назад смена изображения идет, но само не меняет никак.

при загрузки страницы ошибки такие:

[cycle] DOM not ready, queuing slideshow jquery.cycle.all.min.js:11

[cycle] 1 - img slide not loaded, requeuing slideshow: site.ru/images/promo/5.jpg 0 0

По прежнему прошу помощи, буду благодарен за любую помощь!

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий