Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 12.11.2013, 23:38   #1
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию JavaScript. перемещение

как сделать, чтобы после выбора объекта (нажатии на картинку), при нажатии на кнопку (в качестве кнопки используется другая картинка) выбранный объект перемещался вправо?

Код:
/////////// картинка в качестве кнопки ///////
 	var BtnR = document.createElement('div');

	BtnR.style.width='100px';

	BtnR.style.height='100px';

	BtnR.style.backgroundImage = "url('paste.jpg')";
	BtnR.style.position = 'absolute';

	BtnR.style.top = 5;
	
	BtnR.style.left =120;


	document.body.appendChild(BtnR);


	
 ////// картинка в качестве объекта ///////
var cat = document.createElement('div');

cat.style.width='50px';

cat.style.height='50px';

cat.style.backgroundImage = "url('moto.png')";


cat.style.position = 'absolute';

cat.style.top = 150;
	
cat.style.left =120;

document.body.appendChild(cat);
JavScr вне форума Ответить с цитированием
Старый 13.11.2013, 00:00   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Код:
/////////// картинка в качестве кнопки ///////
 	var BtnR = document.createElement('div');

	BtnR.style.width='100px';

	BtnR.style.height='100px';

    BtnR.style.backgroundColor = "#f00";
	BtnR.style.backgroundImage = "url('paste.jpg')";
	BtnR.style.position = 'absolute';

	BtnR.style.top = '5px';
	
	BtnR.style.left = '120px';


	document.body.appendChild(BtnR);


	
 ////// картинка в качестве объекта ///////
var cat = document.createElement('div');

cat.style.width='50px';

cat.style.height='50px';

cat.style.backgroundColor = "#ff0";

cat.style.backgroundImage = "url('moto.png')";


cat.style.position = 'absolute';

cat.style.top = '150px';
	
cat.style.left = '120px';

document.body.appendChild(cat);

var selected = false;

cat.onclick = function(){
    selected = this;
}

BtnR.onclick = function(){
    if (!selected) return false;
    tmp = parseInt(selected.style.left,10) + 50;
    selected.style.left = tmp + 'px';
}
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 13.11.2013, 11:16   #3
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

спасибо огромное. код работает. но возникла проблема, как изменить функцию, чтобы она зависела от того, какую кнопку нажимают (например, на только вправо, но и если есть кнопка влево)
JavScr вне форума Ответить с цитированием
Старый 15.11.2013, 17:28   #4
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

Код:
	var Btn3 = document.createElement('div');
	Btn3.style.width='65px';
	Btn3.style.height='65px';
	Btn3.style.backgroundColor = "#afe";
	Btn3.style.position = 'absolute';
	Btn3.style.top = '5px';
	Btn3.style.left ='235px';
	document.body.appendChild(Btn3);
	Btn3.onclick = justAdd;

var BtnL = document.createElement('div');
BtnL.style.width='100px';
BtnL.style.height='100px';
BtnL.style.backgroundColor = "#f00";
BtnL.style.position = 'absolute';
BtnL.style.top ='5px';
BtnL.style.left ='5px';
document.body.appendChild(BtnL);

 	var BtnR = document.createElement('div');
	BtnR.style.width='100px';
	BtnR.style.height='100px';
	BtnR.style.backgroundColor = "#f00";
	BtnR.style.position = 'absolute';
	BtnR.style.top = '5px';
	BtnR.style.left ='120px';
	document.body.appendChild(BtnR);

var cat = document.createElement('div');
cat.style.width='47px';
cat.style.height='47px';
cat.style.backgroundColor = "#ff0";
cat.style.position = 'absolute';
cat.style.top = '150px';	
cat.style.left = '120px';
document.body.appendChild(cat);

function justAdd()

{
	for (var i=0; i<2; i++)

	{	
		var newCat = document.createElement('div');	
		newCat.style.width='47px';	
		newCat.style.height='47px';
		newCat.style.backgroundColor = "#ff0";		
		newCat.style.position = 'absolute';
		newCat.style.top = 100+Math.random()*500;
		newCat.style.left = 100+Math.random()*500;	
		document.body.appendChild(newCat);
	}
} 


var selected = false;

cat.onclick = function()
{
    selected = this;
}

BtnR.onclick = function()
{
    	if (!selected) return false;
    	tmp = parseInt(selected.style.left,10) + 50;
    	selected.style.left = tmp + 'px';
}

BtnL.onclick = function()
{
    	if (!selected) return false;
    	tmp = parseInt(selected.style.left,10) - 50;
    	selected.style.left = tmp + 'px';
}
как доработать код, чтобы можно было выбирать любой объект Cat для перемещения (даже после добавления новых (функция justAdd)?
JavScr вне форума Ответить с цитированием
Старый 15.11.2013, 19:20   #5
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

спасибо. исправил сам, все заработало!
JavScr вне форума Ответить с цитированием
Старый 15.11.2013, 22:03   #6
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

смотрел в интернете примеры с onKeyDown, onKeyPrees и onKeyDown, так и не понятно , как их написать для моего примера, т.к. большинство инфы в сочетании с кодом html. И сказывается то, что недавно начал изучение javascript. помогите, пожалуйста.
JavScr вне форума Ответить с цитированием
Старый 17.11.2013, 21:16   #7
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

ни кто не знает что ли?
JavScr вне форума Ответить с цитированием
Старый 17.11.2013, 22:31   #8
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

не, впервые вижу. Это все ересь и безумство, есть только одно событие - onclick
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 17.11.2013, 22:42   #9
JavScr
Пользователь
 
Регистрация: 12.11.2013
Сообщений: 39
По умолчанию

Цитата:
Naive не, впервые вижу. Это все ересь и безумство, есть только одно событие - onclick
а как тогда это: http://alldes.narod.ru/javascript/js2.htm
JavaScript: события
JavScr вне форума Ответить с цитированием
Старый 18.11.2013, 07:29   #10
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Не-е-е-ет!!! Онклик, только онклик! Раминь!
На тач-устройствах тоже только онклик.
На элементах формы тоже только онклик.
И пользовательских событий не существует.
Alar, верни репу!
Naive вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
перемещение Ivannikov-Vlad Общие вопросы Delphi 0 13.03.2013 22:25
Перемещение в БД Михаил Юрьевич Общие вопросы Delphi 3 02.10.2011 01:14
Javascript - классы, они есть или их нету в Javascript? Kasper1 JavaScript, Ajax 3 05.03.2011 09:42
Перемещение TImage Романнн Общие вопросы Delphi 1 27.10.2008 18:38