dHTML_ELamanin1yerden_baska1yere.htm

dHtml - Elemanın bir yerden başka bir yere taşınması

Bundan sonraki işlemlerde katmanımızı bir nesne gibi kullanacağız. Bunun içinde kullanacağımız özelliklerle ilgili değişkenleri birer pointer olarak tanımlayacağız.

Bu işlem için tanımla fonkisiyonunu kullanacağız ve bu fonksiyon içerisinde pointer değişkenleri tanımlayacağız. Önceki örneğimizi bu şekilde yapmıştık. İlk olarak bir katmanı pointer değişken olarak tanımlayacağız ve bu değişken üzerinden o katmanın tüm özelliklerini değiştireceğiz.


if(ie4) elaman = alan.style;
if(ns4) eleman = document.alan;
if(ns6) eleman = document.getElementById("alan").style;

Bundan sonta eleman isimli değişkenimiz alan adlı katmanımıza işaret edecektir.

Katmanı taşımak

Katmanımızı bulunduğu yerden verilen yeni konuma götürme işlemini yapacağımız fonksiyona tasi adı veriyoruz. Bu fonksiyon ile katmanımızı başka bir konuma taşıyabileceğiz. Burada iki yeni değişken kullanacağız. Bunlar

eleman.xkon // elemanın yatay konum değerini tutacak;
eleman.ykon // elemanın dikey konum değerini tutacak;

İlk olarak bu değişkenlerimizi tanımlayalım ve ilk değerlerini atayalım. Bunun için tanimla fonksiyonunu değiştireceğiz.


function tanimla()
{
if(ie4) elaman = alan.style;
if(ns4) eleman = document.alan;
if(ns6) eleman = document.getElementById("alan").style;
eleman.xkon = parseInt(eleman.left);
eleman.ykon = parseInt(eleman.top);
}
onload = tanimla;

Burada left ve top özellikleri birer sitil özelliği olduğunu biliyorsunuz. Ayrıca parseInt metodunu kullanmamızın sebebi IE ve NS6 elemanın top ve left değerlerini verirken sonuna "px" yani pixel ekini eklemeleridir. Bu metodla bu eki silip sonucu tam sayıya çeviriyoruz. Şimdide katmanımızın konum değerlerini öğrenmek için bu değişkenleri kullanalım.


<A HREF="javascript:alert('katmanın x konumu = ' + eleman.xkon);">
x konum değeri</A>
<A HREF="javascript:alert('katmanın y konumu = ' + eleman.ykon);">
y konum değeri</A>
Şimdi katmanın konumunu bildiren örneğimizi denemek için tıklayınız .

Elemanın left ve top değerlerini kullanabildiğimize göre tasi fonksiyonunu yazabiliriz.


function tasi(nsn,x,y)
{
nsn.xkon = x;
nsn.ykon = y;
nsn.left = nsn.xkon;
nsn.top = nsn.ykon;
}

İlk iki satırda x ve y değerlerini elemanımızın xkon ve ykon değişkenlerine atıyoruz ve son iki satırda ise xkon ve ykon değerlerini sırasıyla elemanımızın left ve top değerlerine atayarak elemanımızı ( katmanımızı ) taşıyoruz. Şimdi sonucu görelim .

Elemanı bulunduğu yerden verilen değer kadar başka bir here götürme

Bu çalışmamızda elemanımızı bulunduğu yerden verdiğimiz değer kadar götüreceğiz. Bunun anlamı yeni xkon ve ykon değerlerini bulurken ilk ykon ve xkon değerlerine verilen y ve x değerlerini ekleyerek yeni konumu bulacağız.


function gotur(nsn,x,y)
{
nsn.xkon +=x;
nsn.ykon +=y;
nsn.left = nsn.xkon;
nsn.top = nsn.ykon;
}

.

Yardım İçin Sadece Bir Tık Yeter
 
Sponsor
 
.tk
 
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol