SORU
20 Mayıs 2011, Cuma


/Y, clientX/Y ve pageX/Y screenX arasındaki fark nedir?

/Y, clientX/Y ve pageX/Y screenX arasındaki fark nedir?

Ayrıca iPad Safari için, hesaplamaları masaüstü YA da benzer görünüm penceresi yüzünden biraz fark var mıdır?

Eğer bir örnek bunu çok iyi olurdu.

CEVAP
17 ŞUBAT 2012, Cuma


JavaScript:

pageX, pageY, screenX, genç, clientX ve clientY verir "css piksel bir noktayı referans noktası. fiziksel sayısını belirten bir sayı Kullanıcı tıklandığında nerede, referans noktası sol üst noktasıdır. Bu özellikler, bu referans noktasından yatay ve dikey mesafeyi döndürür.

pageX ve pageY:
Tamamen işlenmiş içerik alanının sol üst köşesine göre tarayıcıda. Bu referans noktası sol üstte url bar ve Geri düğmesini altındadır. Bu noktada her yerde tarayıcı penceresinde olabilir ve aslında sekmeli sayfaları içinde gömülü ve kullanıcı kaydırma çubuğunu hareket ederse yer değiştirebilir.

screenX ve genç:
Fiziksel ekran/monitör üst sol göre, bu referans noktası sadece eğer artırırsanız taşır ya da monitör ya da ekran çözünürlüğü sayısını azaltmak.

clientX ve clientY:
Tarayıcı penceresinin içerik alanının üst sol kenarı (the viewport) göre. Bu noktada eğer kullanıcı tarayıcıdan bir kaydırma çubuğunu hareket ederse hareket bile etmez.

Bir visual hangi özellikleri destekleyen tarayıcılar için:

http://www.quirksmode.org/dom/w3c_cssom.html#t03

w3schools her ne çevrimiçi Javascript tercüman ve editör var

http://www.w3schools.com/jsref/tryit.asp?filename=try_dom_event_clientxy

<!DOCTYPE html>
<html>
<head>
<script>
function show_coords(event)
{
  var x=event.clientX;
  var y=event.clientY;
  alert("X coords: "   x   ", Y coords: "   y);
}
</script>
</head>

<body>

<p onmousedown="show_coords(event)">Click this paragraph, 
and an alert box will alert the x and y coordinates 
of the mouse pointer.</p>

</body>
</html>

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • bunnyboxx

    bunnyboxx

    17 NİSAN 2008
  • Derek Banas

    Derek Banas

    12 AĞUSTOS 2008
  • LevelUpTuts

    LevelUpTuts

    20 Ocak 2012