JQuery

JQuery: Trabalhando com animate() – Movendo objeto

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#btnMover").click(function(){
  $("#elemento").animate({ 
    // distancia da margem a esquerda
    marginLeft: "200px",
    // distância do topo
    marginTop: "200px"
    // tempo de execucao - milissegundos
    }, 1000, function() {
     $(this).html("chegamos!");
    });
  });
});
</script>
<input type="button" id="btnMover" value="Mover">
<div id="elemento" style="border:1px solid #FF0000; width:180px; height:80px;">
  clique para mover
</div>

Veja funcionando:

[iframe http://jsfiddle.net/c9eVH/1/embedded/result/ 600 400]

12 comentários sobre “JQuery: Trabalhando com animate() – Movendo objeto

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *