Слайдер на jQuery - JavaScript, Ajax

CraZZZy-GameRRR · 25.07.2012, 21:58

Не хочет работать слайдер. Помогите найти ошибку.

Код HTML:

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; utf-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="style.css">
	<script src="http://yandex.st/jquery/1.7.2/jquery.min.js"></script>
	<script type="text/javascript">
		function showSlide(n){
			$('button').removeAttr('disabled');
			$('#b' + n).attr('disabled', 'disabled');

			var last = $('.active').removeClass('active').addClass('last-active').get(0);
			$('#slide' + n).fadeOut(0).addClass('active').fadeIn(800, function() {
				$(last).removeClass('last-active');
			});
			var x;
			
		}
	</script>

	<style type="text/css">
		#slider {
			position: relative;
			width: 500px;
			height: 333px;
		}

		#slider img {
			position: absolute;
			z-index: 20;
		}

		.active {
			z-index: 40;
		}

		.last-active {
			z-index: 30;
		}
	</style>
</head>

<body>
	<div id="slider">
		<img src="01.jpg" id="slide1" class="active" alt="">
		<img src="02.jpg" id="slide2" alt="">
		<img src="03.jpg" id="slide3" alt="">
		<img src="04.jpg" id="slide4" alt="">
		<img src="05.jpg" id="slide5" alt="">
	</div>

	<button onClick="showSlide(1)" id="b1" disabled="disabled">1</button> 
	<button onClick="showSlide(2)" id="b2">2</button> 
	<button onClick="showSlide(3)" id="b3">3</button> 
	<button onClick="showSlide(4)" id="b4">4</button> 
	<button onClick="showSlide(5)" id="b5">5</button>
</body>
</html>

lux16 · 26.07.2012, 12:13

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

CraZZZy-GameRRR · 26.07.2012, 18:15

Неплохая мысль! Вот как я сделал:

Код HTML:

<div id="slider">
	<img>
	<img src="1.jpg">
</div>


var img = [];
for (var i = 1; i <= 5; i++) {
	img[i] = new Image();
	img[i].src = ''i + '.jpg';
}

function showSlide(n){
	$('button').removeAttr('disabled');
	$('#b' + n).attr('disabled', 'disabled');

	$('#slider img:first').remove();
	$(img[n]).css('display', 'none').appendTo($('#slider')).fadeIn(500);
	
}

lux16 · 27.07.2012, 01:02

Хм, а почему не сделать в виде карусели ? По-моему будет проще =)) У тебя как-то все замудрено

CraZZZy-GameRRR · 27.07.2012, 01:07

Цитата:

Сообщение от lux16

Хм, а почему не сделать в виде карусели ?

А можно с этого места по-подробней?

Цитата:

Сообщение от lux16

У тебя как-то все замудрено

У меня всегда так.

)

lux16 · 27.07.2012, 01:24

Код:

Ну почему вот так:

|                             |
|     Изображение      |
|                             |

1 2 3 4 5 6 7 8 9 10 11

А не так:

____________________
|                             |
| <  Изображение  >  | 
|                             |
-----------------------

lux16 · 27.07.2012, 01:25

А давай как пиши в скайп, если спать еще не хочется

CraZZZy-GameRRR · 27.07.2012, 01:39

через icq.

26.07.2012, 12:13	#2
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	Если хочешь сделать свой, то я бы сделал по-другому, просто один контейнер и в него вставляются имена файлов из массива, это будет коряво, но зато просто Хочу быть лучшим, но пока что я только обычный =(

27.07.2012, 01:02	#4
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	Хм, а почему не сделать в виде карусели ? По-моему будет проще =)) У тебя как-то все замудрено Хочу быть лучшим, но пока что я только обычный =(

27.07.2012, 01:24	#6
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	Код: `Ну почему вот так: \| \| \| Изображение \| \| \| 1 2 3 4 5 6 7 8 9 10 11 А не так: ____________________ \| \| \| < Изображение > \| \| \| -----------------------` Хочу быть лучшим, но пока что я только обычный =(

27.07.2012, 01:25	#7
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	А давай как пиши в скайп, если спать еще не хочется Хочу быть лучшим, но пока что я только обычный =(

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Jquery! Mousewheel, Scrolling, слайдер для IE?	AlienNation	JavaScript, Ajax	0	20.04.2012 02:37
Слайдер видеороликов	Minus_yu	JavaScript, Ajax	4	14.04.2012 12:51
Свой слайдер	Abuhamed	JavaScript, Ajax	3	29.02.2012 20:01
Слайдер	dekameron	JavaScript, Ajax	0	05.04.2011 04:39
Слетает слайдер в IE 6	zlo_999	HTML и CSS	2	22.01.2011 22:30

27.07.2012, 01:39	#8
CraZZZy-GameRRR Пользователь Регистрация: 15.04.2010 Сообщений: 98	через icq.