Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Javascript. kwicks плагин / 23 сообщений из 23, страница 1 из 1
05.08.2012, 17:57:18
    #37904895
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
Что я делаю не так? Уже 3й час головой об стену бьюсь!


Код: 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.
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Untitled 1</title>
<script type="text/javascript" src="../jq/jquery.js"></script>
<script type="text/javascript" src="../jq/jquery.kwicks-1.5.1.js"></script>
<script type="text/javascript" src="Easing.js"></script>
<script type="text/javascript" >
$().ready(function() {
    $('.kwicks').kwicks({
        max: 320,
        spacing: 5,
        duration: 1500,
        easing: 'easeOutBounce'
    });
});


</script>
<style type="text/css" >
.kwicks li {  
    float: left;  
    width: 125px;  
    height: 100px;  
    margin-right: 5px;  
}  
#kwick1 {   
    background-color: #53b388;  
}  
#kwick2 {  
    background-color: #5a69a9;  
}  
#kwick3 {  
    background-color: #c26468;  
}  
#kwick4 {   
    background-color: #bf7cc7;  
    margin-right: 0px;  
}               
</style>

</head>

<body>
<ul class="kwicks">
    <li id="kwick1"></li>
    <li id="kwick2"></li>
    <li id="kwick3"></li>
    <li id="kwick4"></li>
</ul>
</body>

</html>
...
Рейтинг: 0 / 0
05.08.2012, 18:10:54
    #37904904
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
Я не знаю, что такое kwicks и тем более не знаю, что ты делаешь не так, так как непонятно, что у тебя происходит, что нет и что ты хочешь получить. Единственное, что заметил из примеров - этот плагин вроде как использует easing, а ты его подключаешь уже после kwicks.
...
Рейтинг: 0 / 0
06.08.2012, 16:07:32
    #37905924
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
Я понимаю, что нехорошо просить людей делать то, что им совсем не нужно и просить расхлебать чужую кашу, но я начинающий веб-разработчик и мне кажется, что здесь какая-то простая ошибка. Вот ссылка с примером и обьяснениями и даже готовым кодом. Проблема в том, что у меня он не работает! Смотрите пример 6


Заранее спасибо!


IDVsbruck, не помогло.
...
Рейтинг: 0 / 0
06.08.2012, 17:21:43
    #37906088
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
taaamerlan,

Так а что именно не получается?
...
Рейтинг: 0 / 0
06.08.2012, 18:26:21
    #37906210
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
А все я разобрался. Там в CSS проблемка. Нужно просто весь CSS правильно добавить.

Должен быть вот такой стайлшит:
Код: css
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.
<style type="text/css" >
	.kwicks {
		list-style: none;
		position: relative;
		margin: 0;
		padding: 0;
	}
	.kwicks li {  
		float: left;  
		width: 125px;  
		height: 100px;  
		margin-right: 5px;
		display: block;
		overflow: hidden;
		padding: 0;
		cursor: pointer;
	}  
	#kwick1 {   
		background-color: #53b388;  
	}  
	#kwick2 {  
		background-color: #5a69a9;  
	}  
	#kwick3 {  
		background-color: #c26468;  
	}  
	#kwick4 {   
		background-color: #bf7cc7;
		margin-right: 0px;			
	}               
</style>



И работает точно так как в примере.
...
Рейтинг: 0 / 0
06.08.2012, 19:53:28
    #37906305
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, насколько я понял конечный код, таков

Код: 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.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Untitled 1</title>
<script type="text/javascript" src="../jq/jquery.js"></script>
<script type="text/javascript" src="../jq/jquery.kwicks-1.5.1.js"></script>
<script type="text/javascript" src="Easing.js"></script>
<script type="text/javascript" >
$().ready(function() {
    $('.kwicks').kwicks({
        max: 320,
        spacing: 5,
        duration: 1500,
        easing: 'easeOutBounce'
    });
});
</script>

<style type="text/css" >
	.kwicks {
		list-style: none;
		position: relative;
		margin: 0;
		padding: 0;
	}
	.kwicks li {  
		float: left;  
		width: 125px;  
		height: 100px;  
		margin-right: 5px;
		display: block;
		overflow: hidden;
		padding: 0;
		cursor: pointer;
	}  
	#kwick1 {   
		background-color: #53b388;  
	}  
	#kwick2 {  
		background-color: #5a69a9;  
	}  
	#kwick3 {  
		background-color: #c26468;  
	}  
	#kwick4 {   
		background-color: #bf7cc7;
		margin-right: 0px;			
	}               
</style>

</head>

<body>
<ul class="kwicks">
    <li id="kwick1"></li>
    <li id="kwick2"></li>
    <li id="kwick3"></li>
    <li id="kwick4"></li>
</ul>
</body>

</html>



чего-то не фурычит, как его поправить?
и как залечить валидатор:

Line 6, Column 68: end tag for "meta" omitted, but OMITTAG NO was specified
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

Line 6, Column 1: start tag was here
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
...
Рейтинг: 0 / 0
06.08.2012, 20:09:38
    #37906326
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
катастрофа,

По валидаторам не спец - лучший валидатор - браузер.
А "не фурычит" - не описание ошибки, а нытье ламера. Включаем файрбаг и смотрим. У меня все фурычит.
...
Рейтинг: 0 / 0
06.08.2012, 20:10:43
    #37906328
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, полный код того что фурычит выложить можете?
...
Рейтинг: 0 / 0
06.08.2012, 20:16:04
    #37906332
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
катастрофа,

Легко:
Код: 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.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
<head>
	<meta charset="utf-8" />
	<title>Untitled 1</title>
	<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="js/kwicks.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<script type="text/javascript" >
		$().ready(function() {
			$('.kwicks').kwicks({
				max: 220,
				spacing: 5,
				duration: 1500,
				easing: 'easeOutBounce'
			});
		});

	</script>
	<style type="text/css" >
		.kwicks {
			list-style: none;
			position: relative;
			margin: 0;
			padding: 0;
		}

		.kwicks li {  
			float: left;  
			width: 125px;  
			height: 100px;  
			margin-right: 5px;
			display: block;
			overflow: hidden;
			padding: 0;
			cursor: pointer;
		}  
		#kwick1 {   
			background-color: #53b388;  
		}  
		#kwick2 {  
			background-color: #5a69a9;  
		}  
		#kwick3 {  
			background-color: #c26468;  
		}  
		#kwick4 {   
			background-color: #bf7cc7;
			margin-right: 0px;			
		}               
	</style>

</head>
<body>

<h2>К(Х)уїкс</h2>
<div style="float: left; width: 515px;">
    <ul class="kwicks">
        <li id="kwick1"></li>
        <li id="kwick2"></li>
        <li id="kwick3"></li>
        <li id="kwick4"></li>
    </ul>
</div>

</body>
</html>


...
Рейтинг: 0 / 0
06.08.2012, 20:34:59
    #37906348
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, сами когда последний раз его пробовали?
Из Пример 6: Пользовательские эффект и длительность перехода
работают?
...
Рейтинг: 0 / 0
06.08.2012, 21:15:28
    #37906390
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
катастрофа,

Да ты издеваешься что ли? Этот код я скопировал из своего РАБОЧЕГО примера. Тебе осталось только разобраться в нем.

Что за люди? Ты можешь по человечески указать что именно работает не так как ты того ожидал?
...
Рейтинг: 0 / 0
06.08.2012, 21:19:45
    #37906395
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, вижу только четыре квадрата, которые размещены по горизонтали, а ожидал
http://ruseller.com/adds/adds2276/example/example.html - пример номер шесть, наводим курсор и горы раздвигаются
...
Рейтинг: 0 / 0
06.08.2012, 21:22:32
    #37906396
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
катастрофа,

Яваскрипт подключи, да?
...
Рейтинг: 0 / 0
06.08.2012, 21:32:46
    #37906406
катастрофа
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse,
иду на ощупь

Код: 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.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
<head>
	<meta charset="utf-8" />
	<title>Untitled 1</title>
	<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="js/kwicks.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<script type="text/javascript" >
		$().ready(function() {
			$('.kwicks').kwicks({
				max: 220,
				spacing: 5,
				duration: 1500,
				easing: 'easeOutBounce'
			});
		});

	</script>
	<style type="text/css" >
		.kwicks {
			list-style: none;
			position: relative;
			margin: 0;
			padding: 0;
		}

		.kwicks li {  
			float: left;  
			width: 125px;  
			height: 100px;  
			margin-right: 5px;
			display: block;
			overflow: hidden;
			padding: 0;
			cursor: pointer;
		}  
		#kwick1 {   
			background-color: #53b388;  
		}  
		#kwick2 {  
			background-color: #5a69a9;  
		}  
		#kwick3 {  
			background-color: #c26468;  
		}  
		#kwick4 {   
			background-color: #bf7cc7;
			margin-right: 0px;			
		}               
	</style>

</head>
<body>

<script type="text/javascript">
//script type="text/javascript" в body
.kwicks li {  
    float: left;  
    width: 125px;  
    height: 100px;  
    margin-right: 5px;  
}  
#kwick1 {   
    background-color: #53b388;  
}  
#kwick2 {  
    background-color: #5a69a9;  
}  
#kwick3 {  
    background-color: #c26468;  
}  
#kwick4 {   
    background-color: #bf7cc7;  
    margin-right: 0px;  
}  
</script>

<h2>Киев</h2>
<div style="float: left; width: 515px;">
    <ul class="kwicks">
        <li id="kwick1"></li>
        <li id="kwick2"></li>
        <li id="kwick3"></li>
        <li id="kwick4"></li>
    </ul>
</div>

</body>
</html>



не хочет
...
Рейтинг: 0 / 0
06.08.2012, 21:40:34
    #37906414
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
катастрофа,

Не пиши сюда бред. Подключи нормально 3 файла с яваскриптом и скачай себе файрбаг наконец.
...
Рейтинг: 0 / 0
07.08.2012, 21:57:04
    #37907942
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouseкатастрофа,

Легко:
+
Код: 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.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru">
<head>
	<meta charset="utf-8" />
	<title>Untitled 1</title>
	<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="js/kwicks.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<script type="text/javascript" >
		$().ready(function() {
			$('.kwicks').kwicks({
				max: 220,
				spacing: 5,
				duration: 1500,
				easing: 'easeOutBounce'
			});
		});

	</script>
	<style type="text/css" >
		.kwicks {
			list-style: none;
			position: relative;
			margin: 0;
			padding: 0;
		}

		.kwicks li {  
			float: left;  
			width: 125px;  
			height: 100px;  
			margin-right: 5px;
			display: block;
			overflow: hidden;
			padding: 0;
			cursor: pointer;
		}  
		#kwick1 {   
			background-color: #53b388;  
		}  
		#kwick2 {  
			background-color: #5a69a9;  
		}  
		#kwick3 {  
			background-color: #c26468;  
		}  
		#kwick4 {   
			background-color: #bf7cc7;
			margin-right: 0px;			
		}               
	</style>

</head>
<body>

<h2>К(Х)уїкс</h2>
<div style="float: left; width: 515px;">
    <ul class="kwicks">
        <li id="kwick1"></li>
        <li id="kwick2"></li>
        <li id="kwick3"></li>
        <li id="kwick4"></li>
    </ul>
</div>

</body>
</html>



Это антиламерская защита или у тебя глюки?)
...
Рейтинг: 0 / 0
07.08.2012, 22:12:35
    #37907949
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, нужно убирать пробелы внутри тегов.


Кстати народ, почему у меня консоль пишет, что нет такого метода 'easeOutBounce'?


Uncaught TypeError: Object #<Object> has no method 'easeOutBounce'



Своими глазами видел в файле такой эффект. Подключил файл правильно. Ссылки работают (студия проверила). В чем проблема?

Код: 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.
<!DOCTYPE html>
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Untitled 1</title>
<script type="text/javascript" src="../jq/jquery.js"></script>
<script  type="text/javascript" src="../jq/jquery.easing.compatibility.js"></script>
<script type="text/javascript" src="../jq/jquery.kwicks-1.5.1.js"></script>

<script type="text/javascript" >
$().ready(function() {
    $('.kwicks').kwicks({
        max: 320,
        spacing: 5,
        duration: 1500,
        easing: 'easeOutBounce'

    });
});


</script>

<style type="text/css">
	.kwicks {
		list-style: none;
		position: relative;
		margin: 0;
		padding: 0;
	}
	.kwicks li {  
		float: left;  
		width: 125px;  
		height: 100px;  
		margin-right: 5px;
		display: block;
		overflow: hidden;
		padding: 0;
		cursor: pointer;
	}  
	#kwick1 {   
		background-color: #53b388;  
	}  
	#kwick2 {  
		background-color: #5a69a9;  
	}  
	#kwick3 {  
		background-color: #c26468;  
	}  
	#kwick4 {   
		background-color: #bf7cc7;
		margin-right: 0px;			
	}               
</style>
</head>

<body>
<ul class="kwicks">
    <li id="kwick1"></li>
    <li id="kwick2"></li>
    <li id="kwick3"></li>
    <li id="kwick4"></li>
</ul>
</body>

</html>

...
Рейтинг: 0 / 0
08.08.2012, 02:33:22
    #37908069
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
taaamerlan,

Проблема в том, что ты занялся не своим делом.
Напиши наверно тому товарищу, на сайте которого ты пример нашел. Он как раз таким "помогает" активно.
...
Рейтинг: 0 / 0
08.08.2012, 03:23:30
    #37908076
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
Смотри, паренек: все работает , горы твои двигаются и причем именно с тем эффектом и скоростью какой надо.
От тебя требовалось только разобраться. С задачей не справился...
...
Рейтинг: 0 / 0
08.08.2012, 15:58:46
    #37909142
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse,
Так а в чем моя ошибка я не могу понять. Там работает, а у меня нет.
...
Рейтинг: 0 / 0
08.08.2012, 16:45:48
    #37909248
MikkiMouse
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
taaamerlan,

Ошибка в том, что ты не можешь сделать элементарного: подключить jQuery и 2 плагина.

Это просто в голову не укладывается. Человек пишет в профессиональный форум, не удосужившись разобраться в элементарных вещах и при этом ведет себя вызывающе. Сделай выводы, будь попроще, побольше практики и поменьше вопросов на форумах.
Тут уже столько написано знающими людьми, что можно найти ответ на практически любой вопрос.
А если включать мозги, то и тем более )))
...
Рейтинг: 0 / 0
08.08.2012, 18:38:58
    #37909447
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
MikkiMouse, я не могу? Подключено всё правильно. Проблема где-то глубже. И не надо пытаться каждым словом оскорбить. "Ведет себя вызывающе" - ГДЕ? Как?
Бред пишешь. А подключил я все правильно. Стидия и Expression Web проверили.
...
Рейтинг: 0 / 0
08.08.2012, 19:05:25
    #37909479
taaamerlan
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Javascript. kwicks плагин
Нашел проблему: я по ходу с шаманских сайтов те исходники скачал (jquery и 2 плагина). Щас с норм источников скачал. Всё работает как часы. А за поправленный стиль я спасибо так и не сказал. Спасибо!
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Javascript. kwicks плагин / 23 сообщений из 23, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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