Marquee Kullanımı (Kayan Yazı, Resim Yapma)

 

Bir nesneyi kaydırmak için gerekli kodumuz marquee' dir.


<marquee>kaydırılacak nesne</marquee>

 

Marquee Etiketinin Aldığı Parametreler:


<MARQUEE    BEHAVIOR=tip    BGCOLOR=renk    DIRECTION=yön     HEIGHT=n      HSPACE=n     LOOP=n SCROLLAMOUNT=n      SCROLLDELAY=n      VSPACE=n      WIDTH=n>


 

Parametreler

 

Direction

Right: direction parametresine atadığımızda yazılar sağa doğru kayar

Left: kullandığımızda sola doğru kayar (direction kullanmasakta standart sola doğru kayar)

Up: direction up parametresi atandığında nesneler aşağıdan yukarı doğru kayar

Down: parametresinde yukarıdan aşağıya doğru kaydırır.
<marguee direction=right>

Scrolldelay

Kaydırma hızını ayarlar. yazının her bir hareketi arasında kaç milisaniye bekleyeceğini belirler
<marquee scrolldelay=”20″>

scrollamount

Kayma hızını belirten bir sayıdır. Kayan yazının bir defada kaç piksel hareket edeceğini belirler.

Loop

Yazının kaç kez kayacağı belirlenir. Daha sonra da yazı durur.
<marquee loop=”5″>

behavior

BEHAVIOR=tip: Metnin ekranda nasıl hareket edeceğini belirten bu ek SCROLL, SLIDE, ALTERNATE değerlerinden birini alabilir.
SCROLL kullanılmadığında varsayılan olarak kabul edilir ve yazının ilk sınırdan belirip kayarak diğer sınırda kaybolmasıdır.
SLIDE= Yazının bir uçtan başlayıp diğer uçta donmasıdır.
ALTERNATE= Yazının iki uç arasında gidip gelmesidir.
<marquee  behavior="alternate"> Yazılar kaydırılırken ekrandan kaybolmadan bir uçtan diğerine gider 

hspace-vspace Kayan yazının sınırlara ne oranda yaklaşacağını belirler. Bu ek özellikle arka plana bir renk verildiğinde daha da belirginleşir.


Kayan Nesnelerin Yönünü Belirlemek
Kayan yazı yaptık en basit haliyle her zaman aynı yöne kayar standart hali sağdan sola doğru biz ise tam tersi yada aşağıdan yukarı kaymasını istiyorsak Direction parametresini kullanırız.
Bu parametre ile kayan yazımıza yön vermemizi sağlarız .direction tek başına yeterli olmayacağı için 4 adet değer bulunmaktadır.

<marquee direction="up" width="100" height="400" bgcolor="red">
 <img src="1.jpg" width="100px" heigth="800px">
 <img src="2.jpg" width="100px" heigth="800px">
<img src="3.jpg" width="100px" heigth="800px">
</marquee>

//Bu örnekte resimler yukarı doğru kaydırılır.


Kayan Nesnelerin Hızını Ayarlamak
Kayan nesnelerin hızını ayarlamak için scrolldelay ve scrollamoun parametresini kullanırız.

 

<marquee scrolldelay=1> : Kaydırma hızını ayarlar. Yazının her bir hareketi arasında kaç milisaniye bekleyeceğini belirlerN değerine ‘ -1′ veya ‘ INFINITE’ verildiğinde hareket sınırsız olarak tekrarlanır. Tip olarak ‘ SLIDE’ kullanıldığında bu işlem tek bir kez gerçekleşeceğinden LOOP ekini kullanmaya gerek yoktur.Hızlı kayması için küçük; yavas için de büyük değer

 

<MARQUEE SCROLLAMOUNT=.....> Kayan yazı </MARQUEE> ….. burada kayma hızını belirten bir sayıdır. Kayan yazının bir defada kaç piksel hareket edeceğini belirler.

 

 

 

Kayan Nesnelerin kaç defa döneceğini ayarlamak

Loop: bu parametre ile yazının kaç kez geçeceğini belirleriz değer kısmına 5 dersek 5 defa geçer ve ekrandan kaybolur.

 

Kayan Yazıyı Fare İle Durdurma


Marquee ile hareket ettirdiğimiz nesneyi fare ile durdurup hareket ettireceğiz.Burada kayan yazının üzerine mouse ile geldiğinizde duracak, mouse çektiğinizde ise hareket etmeye devam edecektir.Bunun için javascript komutlarından faydalanacağız.

<marquee Onmouseover="this.stop()"> Bu komut kayan yazının üzerine gelindiği zaman yazının durmasınız sağlar.

<marquee onmouseout="this.start()"> Bu komut ise mouse yazının üzerinden çekildiği zaman yazının kaymaya devam etmesini sağlıyor.

<marquee direction="up" scrollamount="5" width:"200" height="110" onMouseOver="this.stop()" onMouseOut="this.start()">kayan yazı üzerine mouse gelince durur, üzerinden çekince hareket eder.</marquee>

 

onMouseOver='this.stop()' :tagı ile fare imlecinin kayan yazımız üzerine geldiği zaman yazının durmasını ,onMouseOut=’this.start()' :tagı ile ise fare imlecinin yazıdan çıktıktan sonra yazının kendi halinde akışına devam etmesini sağlamak için koyduk. Bunlar standart javascript parameterleridir.

 

Güncelleme Tarihi:
1.güncelleme: 22.12.2014


Web hosting by Somee.com