DTE :]

Thursday, January 5, 2012

Posisi Elemen Dinamis Berdasarkan Gerakan Mouse

JavaScript Pointer Pos

Menampilkan Koordinat Sumbu-X dan Sumbu-Y Pointer Mouse

jQuery

$(window).mousemove(function(e) {
    $('h2.deskripsi').text('X = ' + e.pageX + ', Y = ' + e.pageY);
});

HTML

<h2 class='deskripsi'>Koordinat...</h2>

Lihat Demo

Set Posisi Elemen Berdasarkan Koordinat Sumbu-X dan Sumbu-Y Pointer Mouse

jQuery

$(window).mousemove(function(e) {
    $('#box').css({left:e.pageX, top:e.pageY});
});

HTML

<div id='box'></div>

CSS

#box {
  position:absolute; /* Penting! */
  width:150px;
  height:150px;
  background-color:#E77912;
  margin:30px;
}

Lihat Demo

Labels: , ,

2 Comments:

Post a Comment



<< Home