ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Слайдер по исходникам
11 сообщений из 11, страница 1 из 1
Слайдер по исходникам
    #39077077
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
нашел интересный новостной слайдер
Но никак не получается его перенести на свой сайт.
Подскажите, как правильно объединить исходники в один рабочий код?
...
Рейтинг: 0 / 0
15.10.2015, 03:08
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39078338
Павел Гужанов
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Павел Гужанов
Участник
Покажи код, который у тебя получился и не работает
...
Рейтинг: 0 / 0
16.10.2015, 10:33
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39078834
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Павел Гужанов,

Честно говоря, код не сохранился. Могу вас уверить, никакой ценности мои труды не представляли)
Вот другой слайдер. Немного проще
Не подскажите, как правильно собрать эти куски в одно целое?
...
Рейтинг: 0 / 0
16.10.2015, 18:14
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39078858
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Я готов даже немного заплатить)
...
Рейтинг: 0 / 0
16.10.2015, 19:14
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39079207
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Павел Гужанов, вот код. Но почему то не отоборажаются описания к пунктам слайдера.
на юкозе
одностраничник

Код: 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.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
131.
132.
133.
134.
135.
136.
137.
138.
139.
140.
141.
142.
143.
144.
145.
146.
147.
148.
149.
150.
151.
152.
153.
154.
155.
156.
157.
158.
159.
160.
161.
162.
163.
164.
165.
166.
167.
168.
169.
170.
171.
172.
173.
174.
175.
176.
177.
178.
179.
180.
181.
182.
183.
184.
185.
<html>
<head>
<meta charset="utf-8" />
<meta content="width=device-width" name="viewport" />
<title></title>
<link href ="http://wwwwww.ucoz.net/Slider/slider-pro.min.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/examples.css" media="screen" rel="stylesheet" type="text/css" />
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet" type="text/css" /><script type="text/javascript" src="http://wwwwww.ucoz.net/Slider/jquery-1.11.0.min.js"></script><script type="text/javascript" src="http://wwwwww.ucoz.net/Slider/jquery.sliderPro.min.js"></script><script type="text/javascript">
	$( document ).ready(function( $ ) {
		$( '#example5' ).sliderPro({
			width: 670,
			height: 500,
			orientation: 'vertical',
			loop: false,
			arrows: true,
			buttons: false,
			thumbnailsPosition: 'right',
			thumbnailPointer: true,
			thumbnailWidth: 290,
			breakpoints: {
				800: {
					thumbnailsPosition: 'bottom',
					thumbnailWidth: 270,
					thumbnailHeight: 100
				},
				500: {
					thumbnailsPosition: 'bottom',
					thumbnailWidth: 120,
					thumbnailHeight: 50
				}
			}
		});
	});
</script>
</head>

<body>

<div class="slider-pro" id="example5">
<div class="sp-slides">
<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image1_large.jpg" data-src="http://bqworks.com/slider-pro/images/image1_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image2_large.jpg" data-src="http://bqworks.com/slider-pro/images/image2_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image3_large.jpg" data-src="http://bqworks.com/slider-pro/images/image3_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image4_large.jpg" data-src="http://bqworks.com/slider-pro/images/image4_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image5_large.jpg" data-src="http://bqworks.com/slider-pro/images/image5_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image6_large.jpg" data-src="http://bqworks.com/slider-pro/images/image6_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image7_large.jpg" data-src="http://bqworks.com/slider-pro/images/image7_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image8_large.jpg" data-src="http://bqworks.com/slider-pro/images/image8_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image9_large.jpg" data-src="http://bqworks.com/slider-pro/images/image9_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit.</div>
</div>

<div class="sp-slide"><img class="sp-image" data-retina="http://bqworks.com/slider-pro/images/image10_large.jpg" data-src="http://bqworks.com/slider-pro/images/image10_medium.jpg" src="http://wwwwww.ucoz.net/Slider/blank.gif" />
<div class="sp-caption">Sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
</div>
</div>

<div class="sp-thumbnails">
<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image1_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Lorem ipsum</div>

<div class="sp-thumbnail-description">Dolor sit amet, consectetur adipiscing</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image2_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Do eiusmod</div>

<div class="sp-thumbnail-description">Tempor incididunt ut labore et dolore magna</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image3_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Ut enim</div>

<div class="sp-thumbnail-description">Ad minim veniam, quis nostrud exercitation</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image4_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Ullamco oris</div>

<div class="sp-thumbnail-description">Nisi ut aliquip ex ea commodo consequat</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image5_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Duis aute</div>

<div class="sp-thumbnail-description">Irure dolor in reprehenderit</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image6_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Esse cillum</div>

<div class="sp-thumbnail-description">Dolore eu fugiat nulla pariatur excepteur</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image7_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Sint occaecat</div>

<div class="sp-thumbnail-description">Cupidatat non proident, sunt in culpa</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image8_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Deserunt</div>

<div class="sp-thumbnail-description">Mollit anim id est laborum sed ut</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image9_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Unde omnis</div>

<div class="sp-thumbnail-description">Iste natus error sit voluptatem</div>
</div>
</div>

<div class="sp-thumbnail">
<div class="sp-thumbnail-image-container"><img class="sp-thumbnail-image" src="http://bqworks.com/slider-pro/images/image10_thumbnail.jpg" /></div>

<div class="sp-thumbnail-text">
<div class="sp-thumbnail-title">Laudantium</div>

<div class="sp-thumbnail-description">Totam rem aperiam, eaque ipsa quae ab illo</div>
</div>
</div>
</div>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
17.10.2015, 23:20
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39079372
Павел Гужанов
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Павел Гужанов
Участник
Может быть я что-то не догоняю. Скопировал код из предыдущего поста, сделал html файл, запустил. Все работает, картинки меняются, описание ниже картинок тоже меняется. Что не так?
...
Рейтинг: 0 / 0
18.10.2015, 16:03
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39080143
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Павел Гужанов,

Нету описаний к мини картинкам слайдера.

Как сделать, что бы надпись была не под большими картинками, а НАД ними?
Как можно сделать, что бы при перематывании слайдера с последней картинки на первую, он отображал переход как все предыдущие - переходом на след слайд, а не быстрой перемоткой назад через все картинки.
И как вставить несколько таких слайдеров на сайт?
Ибо если размножить код, они начинают конфликтовать.
Заранее спасибо)
...
Рейтинг: 0 / 0
19.10.2015, 14:32
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39080355
Павел Гужанов
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Павел Гужанов
Участник
asdasd2131aaКак сделать, что бы надпись была не под большими картинками, а НАД ними?

Разместить див с описанием перед дивом с картинкой
asdasd2131aaКак можно сделать, что бы при перематывании слайдера с последней картинки на первую, он отображал переход как все предыдущие - переходом на след слайд, а не быстрой перемоткой назад через все картинки.

Это надо смотреть JavaScript код и править в нем
asdasd2131aaИ как вставить несколько таких слайдеров на сайт?

Использовать не только class, но и id
...
Рейтинг: 0 / 0
19.10.2015, 16:39
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39080540
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Павел Гужанов,

авторРазместить див с описанием перед дивом с картинкой
Пробовал, не получается. Тогда надпись не привязывается к слайду или вообще не отображается.

авторЭто на до смотреть JavaScript код и править в нем
http://wwwwww.ucoz.net/Slider/jquery.sliderPro.js]Код
Я не могу найти нужную часть кода.

авторИспользовать не только class, но и id
Как правильно прописать ID в данном случае?
...
Рейтинг: 0 / 0
19.10.2015, 18:08
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39080545
asdasd2131aa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
asdasd2131aa
Гость
Павел Гужанов, про ID я задал тупой вопрос) только понял)
...
Рейтинг: 0 / 0
19.10.2015, 18:09
| Ответить | Цитировать | Написать  
Слайдер по исходникам
    #39080886
Павел Гужанов
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Павел Гужанов
Участник
Добавь в файле несколько алертов, чтобы выводили разное, и смотри, какой срабатывает при нажатии на маленькую картинку. так и найдешь место, которое тебе нужно. Только не забудь подключить в HTML именно твой файл js.

Для размещения описания выше слайда попробуй одеть описание и картинку еще в один див и опиши стили для него.
...
Рейтинг: 0 / 0
20.10.2015, 09:51
| Ответить | Цитировать | Написать  
11 сообщений из 11, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Слайдер по исходникам
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=39079372&tid=1445687]:
 0ms
get settings:
 7ms
get forum list:
 19ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 159ms
get topic data:
 12ms
get forum data:
 3ms
get page messages:
 66ms
get tp. blocked users:
 2ms
others: 218ms
total:  494ms
созд. / загр.: 494ms
x
x
Закрыть


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