FRIHOSTFORUMSSEARCHFAQTOSBLOGSCOMPETITIONS
You are invited to Log in or Register a free Frihost Account!


mover imagem com mouse javascript/ajax





rafael2112
Ola estava procurando um script ajax/javascript de mover uma imagem com o mouse e salvar a ultima posição. Tipo tem uma bola na pagina, dando um clique e move com o mouse, depois salvo a posição, para que na próxima vez que acessas a pagina a bola esteja naquela ultima posição.

Alguém sabe o nome disso, para eu pesquisar sobre o assunto?
D'Artagnan
Não só é uma coisa que vc esta querendo, são duas:

a primeria parte é isso:
http://jqueryui.com/demos/draggable/
no caso era só substituir o div por uma imagem de uma bola

a segunda seria fazer um esquema para pegar a posição e salvar no banco de dados,
no caso do exemplo seria só pegar por js:
$('#draggable').css('top'));
$('#draggable').css('left'));

dai da se fazer uma chamada em ajax ou fazer um post, ou vc poderia guardar em um cookie por js puro mesmo.

lembrando ajax não é efeito, ajax é uma forma de se comunicar com o servidor sem recarregar a pagina, tem outra duvida como vc pretende saber quem movimentou a bola?

é bem dificil achar um pacote com exatamente o que vc quer e salvar o posicionamento de um elemento livre na tela não é realmente mto comum.


exemplo sem testes:

salvar em chutar.php
<?php
mysql_connect('localhost','root','');
mysql_select_db('chuteonline');
mysql_query("insert into bola(x,y) values('{$_GET['x']},{$_GET['y']}')");
?>

copiar o codigo do exemplo na jquery e colocar esse código para mostrar um botao
<button onclick='$.get("chutar.php?x="+$('#draggable').css('top')+"&y="+$('#draggable').css('left')">Salvar</button>

provavelmente esta cheio de erros de sintax , mas o conceito é esse.
gueda
D'Artagnan wrote:
Não só é uma coisa que vc esta querendo, são duas:

a primeria parte é isso:
http://jqueryui.com/demos/draggable/
no caso era só substituir o div por uma imagem de uma bola

a segunda seria fazer um esquema para pegar a posição e salvar no banco de dados,
no caso do exemplo seria só pegar por js:
$('#draggable').css('top'));
$('#draggable').css('left'));

dai da se fazer uma chamada em ajax ou fazer um post, ou vc poderia guardar em um cookie por js puro mesmo.

lembrando ajax não é efeito, ajax é uma forma de se comunicar com o servidor sem recarregar a pagina, tem outra duvida como vc pretende saber quem movimentou a bola?

é bem dificil achar um pacote com exatamente o que vc quer e salvar o posicionamento de um elemento livre na tela não é realmente mto comum.


exemplo sem testes:

salvar em chutar.php
<?php
mysql_connect('localhost','root','');
mysql_select_db('chuteonline');
mysql_query("insert into bola(x,y) values('{$_GET['x']},{$_GET['y']}')");
?>

copiar o codigo do exemplo na jquery e colocar esse código para mostrar um botao
<button onclick='$.get("chutar.php?x="+$('#draggable').css('top')+"&y="+$('#draggable').css('left')">Salvar</button>

provavelmente esta cheio de erros de sintax , mas o conceito é esse.


muito boa as explicações.
Me aventuro no php há muitos anos, mas sempre como hobby. Nos últimos meses estou "profissionalizando", por assim dizer, mas tudo de forma autodidata.

Eu acho fantástico as possibilidades que jQuey e Ajax dão
Propaga
D'Artagnan wrote:
Não só é uma coisa que vc esta querendo, são duas:

a primeria parte é isso:
http://jqueryui.com/demos/draggable/
no caso era só substituir o div por uma imagem de uma bola

a segunda seria fazer um esquema para pegar a posição e salvar no banco de dados,
no caso do exemplo seria só pegar por js:
$('#draggable').css('top'));
$('#draggable').css('left'));

dai da se fazer uma chamada em ajax ou fazer um post, ou vc poderia guardar em um cookie por js puro mesmo.

lembrando ajax não é efeito, ajax é uma forma de se comunicar com o servidor sem recarregar a pagina, tem outra duvida como vc pretende saber quem movimentou a bola?

é bem dificil achar um pacote com exatamente o que vc quer e salvar o posicionamento de um elemento livre na tela não é realmente mto comum.


exemplo sem testes:

salvar em chutar.php
<?php
mysql_connect('localhost','root','');
mysql_select_db('chuteonline');
mysql_query("insert into bola(x,y) values('{$_GET['x']},{$_GET['y']}')");
?>

copiar o codigo do exemplo na jquery e colocar esse código para mostrar um botao
<button onclick='$.get("chutar.php?x="+$('#draggable').css('top')+"&y="+$('#draggable').css('left')">Salvar</button>

provavelmente esta cheio de erros de sintax , mas o conceito é esse.



Por essa e outras dicas que sou teu fã, meu caro 'D'Artagnan'.
Obrigado e um abraço.
rafael2112
D'Artagnan wrote:


lembrando ajax não é efeito, ajax é uma forma de se comunicar com o servidor sem recarregar a pagina, tem outra duvida como vc pretende saber quem movimentou a bola?

é bem dificil achar um pacote com exatamente o que vc quer e salvar o posicionamento de um elemento livre na tela não é realmente mto comum.




Na verdade apenas dei um exemplo da bola, o questão eh outra. O que na verdade preciso seria mais um programa que um site, porem deve rodar no navegador para ter acesso WEB.

Move as imagens em modo administrador e salva para construir a tela, precisaria do Ajax também para mudar imagens sem atualizar o navegador.

Aqui um exemplo de como seria :

http://www.youtube.com/watch?v=LBg9b3PBXhk&feature=related
Related topics
Reply to topic    Frihost Forum Index -> Language Forums -> Portuguese

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2011 Frihost, forums powered by phpBB.