Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.02.2011, 20:21
Интересующийся
Отправить личное сообщение для lastic Посмотреть профиль Найти все сообщения от lastic
 
Регистрация: 10.08.2009
Сообщений: 15

Fading для слайдера
Вcем привет. Делал скрипт столкнулся с проблемой необходимо чтобы картинки не сменялись друг другом а плавно перетекали по таймеру одна в другую т.е fadein fadeout, но сделать пока никак не получается, получается что сначала одна потом другая....

подскажите как быть плиз.

вот штмл
<div id="news_banner">
<div id="banners">
		            <a style="display: inline;" href="/"><img src="news_ban_1.jpg"></a>
		            <a style="display: none;" href=""><img src="news_ban_2.jpg"></a>
		            <a style="display: none;" href=""><img src="news_ban_3.jpg" width="701" height="279"></a>
		        </div>

                <ul id="banner_thumbs">
		            
<li class="selected" onmouseover="showBanner2(0)" onmouseout="showBanner(0)" id="banner_thumb_0"><a href=""></a></li>
		            
<li class="" onmouseover="showBanner2(1)" onmouseout="showBanner(1)" id="banner_thumb_1"><a href=""></a></li>
		            
<li class="" onmouseover="showBanner2(2)" onmouseout="showBanner(2)" id="banner_thumb_2"><a href=""></a></li>
		      
		        </ul>
</div>




var currentBanner = 0;
var rotateInterval = setInterval("nextBanner()", 3000);


function showBanner(num) {
	if (currentBanner == num) {
		clearInterval(rotateInterval);
		rotateInterval = setInterval("nextBanner()", 3000);	
		return;
	}
	$('#banners a').fadeOut(1000);
	$('#banner_thumbs li').removeClass('selected');
	currentBanner = num;

	$('#banners a:eq(' + (currentBanner) + ')').fadeIn(500);
	$('#banner_thumbs li:eq(' + (currentBanner) + ')').addClass('selected');
	clearInterval(rotateInterval);
	rotateInterval = setInterval("nextBanner()", 3000);
}

function nextBanner() {
	var nextNum = currentBanner == 2 ? 0 : currentBanner + 1;
	showBanner(nextNum);
}


function showBanner2(num) {
	if (currentBanner == num) {
		clearInterval(rotateInterval);
		rotateInterval = setInterval("nextBanner()", 10000);	
		return;
	}
	$('#banners a').hide();
	$('#banner_thumbs li').removeClass('selected');
	currentBanner = num;

	$('#banners a:eq(' + (currentBanner) + ')').fadeIn();
	$('#banner_thumbs li:eq(' + (currentBanner) + ')').addClass('selected');
	clearInterval(rotateInterval);
	rotateInterval = setInterval("nextBanner()", 10000);
}
Ответить с цитированием
  #2 (permalink)  
Старый 26.07.2011, 00:45
Новичок на форуме
Отправить личное сообщение для AlexZd Посмотреть профиль Найти все сообщения от AlexZd
 
Регистрация: 26.07.2011
Сообщений: 3

Здравствуйте!
Автор, нашел решение? Или добрые люди подскажите как?
Я пока добился вот такого вот результата: http://demo.twmail.info/ . Но мне нужен вот такой: http://demo.joomlaworks.gr/ , кажется как раз это автор темы и хотел.
Ответить с цитированием
  #3 (permalink)  
Старый 26.07.2011, 11:03
Аспирант
Отправить личное сообщение для lalala Посмотреть профиль Найти все сообщения от lalala
 
Регистрация: 04.03.2011
Сообщений: 87

AlexZd, где там результат?
Ответить с цитированием
  #4 (permalink)  
Старый 26.07.2011, 15:01
Новичок на форуме
Отправить личное сообщение для AlexZd Посмотреть профиль Найти все сообщения от AlexZd
 
Регистрация: 26.07.2011
Сообщений: 3

В смысле результат?
http://demo.twmail.info/ - на этом сайте слайдер вверху, его трудно не заметить, это то что я пока сделал, понажимайте на стрелки.
http://demo.joomlaworks.gr/ - здесь тоже слайдер вверху под надписью "Frontpage SlideShow (by JoomlaWorks)" в правое его части типа вкладки, понажимайте на них.
Ответить с цитированием
  #5 (permalink)  
Старый 26.07.2011, 15:32
Аспирант
Отправить личное сообщение для lalala Посмотреть профиль Найти все сообщения от lalala
 
Регистрация: 04.03.2011
Сообщений: 87

AlexZd,
тогда, как автор работы, Вы должны прекрасно знать вот эту страничку и знать все настройки для работы слайдера, которые Вам помогут
Ответить с цитированием
  #6 (permalink)  
Старый 27.07.2011, 12:52
Новичок на форуме
Отправить личное сообщение для AlexZd Посмотреть профиль Найти все сообщения от AlexZd
 
Регистрация: 26.07.2011
Сообщений: 3

Я не говорил что я автор этого слайдера . Видите там происходит сдвиг влево, как вы можете заметить я переделал его на исчезание, но мне нужен не совсем эффект исчезания и появления нового слайда, а перетекание. В настройках слайдера нету такого вида. Вот и вопрос как сделать именно перетекание как здесь http://demo.joomlaworks.gr/

Последний раз редактировалось AlexZd, 27.07.2011 в 12:55.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Новая система управления сайтом Scripto CMS deepslam Ваши сайты и скрипты 38 31.01.2011 14:55
Подскажите простое решение для слайдера Netherlandman Общие вопросы Javascript 10 13.11.2010 09:32
Модуль для работы с модулями JSprog Ваши сайты и скрипты 29 02.09.2009 13:31