ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / как зациклить прокрутку?
9 сообщений из 9, страница 1 из 1
как зациклить прокрутку?
    #38120669
amster13
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
amster13
Гость
вот простейший слайдер без анимации. никак не дойду, как сделать прокрутку по кругу если неизвестно количество изображений - может быть 4, может быть 9 или 12?
Код: html
1.
2.
3.
4.
5.
<div class="view-big-image">
    <div class="field-item field-item-0"><img src="skidka0.jpg" /></div>
    <div class="field-item field-item-1"><img src="skidka1.jpg" /></div>
     ...
</div>


Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
(function($){
$('.view-big-image').append('<div class="left_now"></div><div class="right_now"></div>');
$('.view-big-image .field-item-0').addClass('active');

$('.right_now').click(function(){
$('.view-big-image .field-item.active').next().filter(function(){
$(this).addClass('active').show();
$(this).prev().removeClass('active').hide(); 
});
});

$('.left_now').click(function(){
$('.view-big-image .field-item.active').prev().filter(function(){
$(this).addClass('active').show();
$(this).next().removeClass('active').hide(); 
});
});
})(jQuery)



может кто подскажет?
...
Рейтинг: 0 / 0
23.01.2013, 05:10
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38120725
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
amster13никак не дойду, как сделать прокрутку по кругу если неизвестно количество изображений
Просто вставляй первый элемент в самый конец контейнера + анимация...
...
Рейтинг: 0 / 0
23.01.2013, 08:50
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38120743
amster13
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
amster13
Гость
че-то не совсем... подробнее можешь пояснить?
...
Рейтинг: 0 / 0
23.01.2013, 09:05
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38120817
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
amster13подробнее можешь пояснить?
А пример тестовый по-лучше можешь сделать?
...
Рейтинг: 0 / 0
23.01.2013, 10:14
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38122140
amster13
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
amster13
Гость
он так и выглядит, почти. в скрипте есть еще пара строчек - под слайдером расположены уменьшенные картинки small-image - при клике должны выводиться в слайдер. полный код
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
(function($){
$('.view-big-image').append('<div class="left_now"></div><div class="right_now"></div>');
$('.view-big-image .field-item-0').addClass('active');

$('.right_now').click(function(){

$('.view-big-image .field-item.active').next().filter(function(){
$(this).addClass('active').show();
$(this).prev().removeClass('active').hide(); 
});
});

$('.left_now').click(function(){

$('.view-big-image .field-item.active').prev().filter(function(){
$(this).addClass('active').show();
$(this).next().removeClass('active').hide(); 

});
});
$('.view-small-image .field-item').click(function(){

id = $(this).attr('class').split('-');
id = id[3];

$('.view-big-image .field-item').hide().removeClass('active');
$('.view-big-image .field-item-'+id).show().addClass('active');

$('html,body').animate({
scrollTop: 380,
},400);
});
})(jQuery)


и как тут сделать, чтоб не останавливаться на 4-ой(6ой, 10й) картинке, или если листать назад-на первой?
...
Рейтинг: 0 / 0
23.01.2013, 19:15
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38122338
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
amster13 , это и есть тестовый пример?
...
Рейтинг: 0 / 0
23.01.2013, 22:31
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38122439
amster13
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
amster13
Гость
а что не так?
...
Рейтинг: 0 / 0
23.01.2013, 23:51
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38122441
amster13
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
amster13
Гость
http://make4planet.x10.mx/sl/
...
Рейтинг: 0 / 0
23.01.2013, 23:52
| Ответить | Цитировать | Написать  
как зациклить прокрутку?
    #38122667
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
amster13а что не так?
Вот так должен выглядеть тестовый пример.

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}
div {
	width: 222px;
	height: 54px;
	padding: 5px;
	margin: 10px;
	border: 1px solid;
	overflow: hidden;
}
ul {
	width: 1000px;
	list-style: none;
	overflow: hidden;
}
li {
	float: left;
	width: 50px;
	height: 50px;
	border: 1px solid;
}
li + li {
	margin-left: 5px;
}
</style>
<script type="text/javascript">
function rotate() {
	var oc=document.getElementById('scr');
	var o=oc.getElementsByTagName('li')[0];
	oc.appendChild(o);
};
</script>
</head>
<body onload='setInterval(rotate,500);'>
<div>
	<ul id='scr'>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
		<li>5</li>
		<li>6</li>
		<li>7</li>
		<li>8</li>
		<li>9</li>
	</ul>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
24.01.2013, 08:56
| Ответить | Цитировать | Написать  
9 сообщений из 9, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / как зациклить прокрутку?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38120669&tid=1448821]:
 0ms
get settings:
 6ms
get forum list:
 18ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 162ms
get topic data:
 10ms
get forum data:
 3ms
get page messages:
 54ms
get tp. blocked users:
 2ms
others: 261ms
total:  522ms
созд. / загр.: 522ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]