|
|
Регистрация Восстановить пароль |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
25.07.2012, 21:58 | #1 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 98
|
Слайдер на jQuery
Не хочет работать слайдер. Помогите найти ошибку.
Код 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> |
26.07.2012, 12:13 | #2 |
Форумчанин
Регистрация: 11.02.2009
Сообщений: 305
|
Если хочешь сделать свой, то я бы сделал по-другому, просто один контейнер и в него вставляются имена файлов из массива, это будет коряво, но зато просто
Хочу быть лучшим, но пока что я только обычный =(
|
26.07.2012, 18:15 | #3 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 98
|
Неплохая мысль! Вот как я сделал:
Код 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); } Последний раз редактировалось CraZZZy-GameRRR; 26.07.2012 в 19:03. |
27.07.2012, 01:02 | #4 |
Форумчанин
Регистрация: 11.02.2009
Сообщений: 305
|
Хм, а почему не сделать в виде карусели ? По-моему будет проще =)) У тебя как-то все замудрено
Хочу быть лучшим, но пока что я только обычный =(
|
27.07.2012, 01:07 | #5 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 98
|
|
27.07.2012, 01:24 | #6 |
Форумчанин
Регистрация: 11.02.2009
Сообщений: 305
|
Код:
Хочу быть лучшим, но пока что я только обычный =(
|
27.07.2012, 01:25 | #7 |
Форумчанин
Регистрация: 11.02.2009
Сообщений: 305
|
А давай как пиши в скайп, если спать еще не хочется
Хочу быть лучшим, но пока что я только обычный =(
|
27.07.2012, 01:39 | #8 |
Пользователь
Регистрация: 15.04.2010
Сообщений: 98
|
через icq.
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
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 |