| |
|
|
| | Всем привет, скажите пожалуста, почему у меня неработает скрипт
<html>
<head>
<script language="javascript">
function fun()
{
var a = document.form.pic.value;
var right = (" " + a);
document.write(right);
}
</script>
</head>
<body>
<form name="form">
<img src="1.jpg" name="pic" onClick="fun()">
</form>
</body>
</html>
|
-Он должен при нажатии перемещать картинку.. | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 09:46)
| | | Это делается так.
<html>
<head>
<script language="javascript">
var a=0;
function fun(id) {
a+=10;
document.getElementById(id).style.left=a;
}
</script>
</head>
<body>
<img style="position:relative" src="1.jpg" id="pic" onClick="fun('pic')">
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 10:20)
| | | Спасибо, но я немного непонял... Вот здесь:
a+=10;
document.getElementById(id).style.left=a;
|
Вот здесь:
style="position:relative"
|
И вот здесь:
Если можешь, обьясни немножко.. Пожалуста | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 10:46)
| | |
a+=10; // Увеличиваем значение текущей координаты на 10. Это то же что a=a+10
document.getElementById(id).style.left=a; // Меняем позицию рисунка
|
style="position:relative" // Задаёт тип позиционирования, без этого не будет перемещаться
|
onClick="fun('pic')"> // Передаём в функцию идентификатор рисунка
|
Кстати, мне самому не понятно почему вот так
a+=10;
document.getElementById(id).style.left=a;
|
работает, а вот так
document.getElementById(id).style.left+=10;
|
срабатывает один раз а при втором клике выдает ошибку "недопустимый аргумент".
Может кто-то просветит? | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 11:02)
| | | кажется так: первый раз значение не задано ( 0)
[ document.getElementById(id).style.left=0+10]
|
а второй раз уже значение возврашает в пикселях, т.е. возвращает не число 10 а строку 10px
[ document.getElementById(id).style.left=10px+10=ошибка]
|
| |
| |
|
|
| |
|
|
| |
для: AlexSol
(28.08.2006 в 11:17)
| | | Хорошая версия. Чтобы проверить нужно как-то превратить в целое число вот это самое
document.getElementById(id).style.left
но я не помню есть ли в JS такая функция. Если есть и знаете то подскажите. | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 11:41)
| | | это не версия, а суровая действительность :)
в число переводит Number(arg), но тут не поможет. попробуйте
alert(document.getElementById(id).style.left)
|
позвращает значение с приписанным px. тоесть нужно через строковые функции удалить это px, а потом перебросить в число.
как-то так:
var str=document.getElementById(id).style.left
str.substring (0, str.length - 3)
document.getElementById(id).style.left=Number(str)
|
| |
| |
|
|
| |
|
|
| |
для: AlexSol
(28.08.2006 в 11:53)
| | | Да. Я алертом и сам успел проверить. Но уж больно наворочено получается с обрезанием строки. Дешевле держать запасную переменную с текущими кординатами. | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 11:56)
| | | to ExtraBrain
parseInt() однако.
var x = '100px';
alert(parseInt(x));
|
| |
| |
|
|
| |
|
|
| |
для: RMW
(28.08.2006 в 12:24)
| | | Короче, получилось вот что:
<html>
<head>
<script language="javascript">
function fun(id) {
document.getElementById(id).style.left=parseInt(document.getElementById(id).style.left)+10;
}
</script>
</head>
<body>
<img style="position:relative; left:0px" src="1.jpg" id="pic" onClick="fun('pic')">
</body>
</html>
|
Но обязательно нужно инициировать начальную позицию left:0px
Всё равно с дополнительной переменной меньше писанины, хотя так более концептуально. | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 12:41)
| | | Ну чтоб лишнюю писанину не разводить можно как-нибудь так:
<html>
<head>
</head>
<body>
<img style="position:relative; left:0px" src="1.jpg" onClick="with(this.style)left=parseInt(left)+10">
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: RMW
(28.08.2006 в 12:53)
| | | Да, красиво. Но лично я не сторонник писать код прямо после onClick=
Вызов функции более универсален. Эту функцию можно тогда будет вызывать и по клику с любого другого обьекта а не только именно с этой картинки.
Вот немного подсократил буков :-)
<html>
<head>
<script language="javascript">
function fun(id) {
o=document.getElementById(id);
o.style.left=parseInt(o.style.left)+10;
}
</script>
</head>
<body>
<img style="position:relative; left:0px" src="1.jpg" id="pic" onClick="fun('pic')">
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 11:02)
| | | Всё спасибо, я понял!!!
А скажи, какие бывают типы позиционирования, и что они обозначают?
style="position:relative"
|
| |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 11:31)
| | | есть ещё
style="position:absolute"
|
Поэкспериментируй и сам поймёшь что к чему. :-) | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 10:20)
| | | А почему если так:
<html>
<head>
<script language="javascript">
var a=0;
function f(id)
{
a=a+10;
document.getElementById(id).style.down=a;
}
</script>
</head>
<body>
<img style="position:relative" src="Avril_Lavinge.jpg" name="pic" onClick="f('pic')">
</body>
</html>
|
то неработает? | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 12:25)
| | | потому что
document.getElementById(id).style.bottom=a;
|
а не down | |
| |
|
|
| |
|
|
| |
для: ExtraBrain
(28.08.2006 в 12:48)
| | | А если надо Up, то что писать? | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 17:50)
| | | top, right, bottom, left | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 09:46)
| | | И ещё.. Есть русунок:
<img src="" width="100" height="100" border="0">
|
Как сделать что-бы при нажатии на него, стало так:
<img src="" width="200" height="200" border="0">
|
И вобще, это возможно сделать в JS? | |
| |
|
|
| |
|
|
| |
для: webmonster
(28.08.2006 в 10:22)
| | |
<html>
<head>
<script>
function f()
{
document.getElementById('img').style.width='200px';
document.getElementById('img').style.height='200px';
}
</script>
</head>
<body>
<img src="Lavigne.jpg" width="100" height="100" border="0" id="img">
<button onclick="f()">увеличить</button>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: RMW
(28.08.2006 в 11:32)
| | | сделал вот пример с перемещением:
линк | |
| |
|
|
| |
|
|
| |
для: Padonak
(29.08.2006 в 06:14)
| | | А как сделать что-бы картинка плавно передвигалась? | |
| |
|
|
| |
|
|
| |
для: webmonster
(30.08.2006 в 17:53)
| | | Или вращалась? | |
| |
|
|
| |
|
|
| |
для: webmonster
(30.08.2006 в 19:46)
| | | Вот есть скрипт (не рабочий..):
<html>
<head>
<script language="javascript">
var a=0;
var b=1;
var c=for(i=1; i<=50; i=i+1){b};
function f(id)
{
a=a+c;
document.getElementById(id).style.left=a;
}
</script>
</head>
<body>
<form name="form">
<img style="position:relative" src="1.jpg" name="pic" onClick="f('pic')">
</form>
</body>
</html>
|
Идея - что-бы он плавно по 1-му пикселю передвигался ровно 50 пикселей. Скажите пожалуста где ошибки.. | |
| |
|
|
| |
|
|
| |
для: webmonster
(30.08.2006 в 20:25)
| | | Надо через setInterval двигать, паузу задавать | |
| |
|
|
| |
|
|
| |
для: 12345
(30.08.2006 в 21:06)
| | | Напиши пожалуста код, а то я неочень понимаю.. | |
| |
|
|
| |
|
|
| |
для: webmonster
(30.08.2006 в 23:49)
| | | монстер емайо... ты вобще смотрел мой линк? чем тебе не нравится плавность перемещения?? там именно по 1 пикселю приращение идет... точно блин говорят: сделай доброе дело и тебе его никогда не простят ха-ха-ха :-) | |
| |
|
|
| |
|
|
| |
для: Padonak
(31.08.2006 в 00:24)
| | | Пасиба! | |
| |
|
|
| |
|
|
| |
для: webmonster
(30.08.2006 в 23:49)
| | | Держи монстер, не мучайся:)
Но старайся по-возможности
предпринимать самостоятельные шаги.
<html>
<head>
<script language="javascript">
var a=0;
var b=50;
function f(o)
{
a++;
document.getElementById(o).style.left=a;
if(a>b)
{
b+=50;
return;
}
setTimeout('f(\''+o+'\')',25);
}
</script>
</head>
<body>
<form name="form">
<img style="position:relative; left:0px" src="1.jpg" id="pic" onClick="f('pic')">
</form>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: RMW
(31.08.2006 в 08:47)
| | | Пасиба! | |
| |
|
|
