27 Ağustos 2013 Salı

KAYAN YAZI VEYA KAYAN RESİM YAPMA HTML KODLARI



  1. Kayan yazı görüntüsü elde edebilmek için kullanılacak olan belirteç çifti <marquee> ... </marquee> ‘dir.


    <marquee> Parametreleri

    <MARQUEE BEHAVIOR=tip BGCOLOR=blue (veya renk kodu ff00ff gibi)

    DIRECTION=yön(up: yukarı doğru varsayılan genelde sağdan soladır) HEIGHT=yükseklik(yukarı doğru kaydıracaksanız bu önemli) HSPACE=n LOOP=n SCROLLAMOUNT=n SCROLLDELAY=n VSPACE=n WIDTH=n>

    BEHAVIOR=tip: Metnin ekranda nasıl hareket edeceğini belirten bu ek SCROLL, SLIDE, ALTERNATE değerlerinden birini alabilir. Ek kullanılmadığında SCROLL değeri varsayılan olarak kabul edilir ve yazı, sınırın bir köşesinden belirerek diğer köşeden kayarak kaybolur. SLIDE eki ise yazının bir köşeden başlayarak diğer köşede donmasını sağlar. Metnin iki köşe arasında gidip gelmesi ise ALTERNATE ekiyle gerçekleştirilebilir.

    <marguee direction=right>,up,down : Sağdan, yukarıdan ve aşağıdan başlayarak kayması sağlanır

    <marquee behavior=alternate> :Yazılar kaydırılırken ekrandan kaybolmadan bir uçtan diğerine gider
    örnek vermek gerekirse
    HSPACE=n: 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.

    <marquee bgcolor=ff00ff> : Kayan yazıların arka plan rengini belirler. : Kayan yazıların arka plan rengini belirler.
    < marquee height=125 width=250> : Yazının kayacağı alanın yüksekliği ve genişliği ayarlanabilir.


    azının kayacağı alanın yüksekliği ve genişliği ayarlanabilir <marquee loop=3> : Yazının kaç kez kayacağı belirlenir. Daha sonra da yazı durur.

    <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.



    <MARQUEE SCROLLAMOUNT=#> Kayan yazı </MARQUEE> …..# kayan yazı hızı



    ÖrnĞİN;


    Kod:
     <marquee> <font color=red size=7 ALIGN=Center>                    Sola Doğru Kayıyor </font></marquee>
    
                         Sola Doğru Kayıyor 
     <marquee direction=right> Sağa Doğru Kayıyor </marquee>
     Sağa Doğru Kayıyor 

    
     <marquee direction=up> Yukarı Doğru Kayıyor </marquee>

    
     <marquee direction=down> Aşağı Doğru Kayıyor </marquee>
            
    Yukarı Doğru Kayıyorşağı Doğru Kayıyor











    Birşeyi kaydırmak için gerekli kodumuz:
    <marquee></marquee> şeklindedir.

    Örneğin YASSAXLI yazısını kaydırmak için
    < marquee>YASSAXLI</marquee> komutunu kullanırız. .

    VARSAYILAN KILSİK

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee>YASSAXLI</marquee>
    </body>
    </html>


    YAZIYI SAĞA SOLA ÇARPMAK

    Ama yazımız sağdan sola doğru kayıyor. Bunu istersek sağa sola çarptırabiliriz. Bunun için behavior="alternate" kullanacağız. Bu kodumuz sağa sola çarptırmak için gerekli olan koddur.

    <html>
    <head>
    <titl>Kayan Yazı-YASSAXLI</title>
    </head>
    <body>
    <marquee behavior="alternate">YASSAXLI</marquee>
    </body>
    </html>


    ALTINA RENK EKLE

    Eğer kırmızı bir şerit üzerinde kaymasını istiyorsak marquee'nin rengini değiştirebiliriz. Bunun için bgColor="red" kodunu kullanabiliriz.

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee behavior="alternate" bgColor="red">YASSAXLI</marquee>
    </body>
    </html>


    AŞAĞIDAN YUKARI KAYDIRMAK

    Yazımızı alttan üste doğru çıkartmak istiorsak direction="up" kodunu kullanırız. Eğer üstten alta doğru kaydırmak istiyorsak direction="down" deriz. Ama bir çok sitede görmüşünüzdür; duyurular bölümü diye alttan üste doğru kayan yazılar vardır. Biz de böyle birşey yapabiliriz. Ben bu durumda behavior="alternate" kodunu
    sileceğim. Silmesek de calışır ama ben çarptırmak istemediğim için siliyorum. Şimdi kodumuzu yazalım:

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee direction="up" bgColor="red">YASSAXLI</marquee>
    </body>
    </html>


    Şimdi burada dikkatimizi çeken bir olay var: Marquee alanı biraz geniş, bunu küçültmemiz gerekmez mi? Bunun için width="100" heigth="800" kodlarımızı kullanıyoruz. Burada width marquee'nin enini heigth ise boyunun boyutunu belirler.

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee direction="up" bgColor="red" width="100" heigth="800">YASSAXLI</marquee>
    </body>
    </html>


    RESMİ KAYDIRMAK

    Şimdi Gelelim resim kaydırmaya aslında bununda yazıdan hiçbir farkı yoktur. Şimdi bir kırmızı şerit üzerinde bir resmimizi kaydıralım

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee width="950" height="100" bgcolor="red">
    <img src="1.jpg" width="100px" heigth="800px">
    </marquee>
    </body>
    </html>
    
    
    OZELHAREKAT
    
    


    BİRÇOK RESİM KAYDIRMAK

    Şimdi 3 tane resmi yan yana kaydıralım. 3 tane resmimizi çağırıyoruz

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee width="950" height="100" bgcolor="red">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    </marquee>
    </body>
    </html>


    RESİMLERİ AŞAĞIDAN YUKARI KAYDIRMAK

    metin kaydırmadan hiç bir farkı yok aslında
    Bunun için de kayan yazıdaki gibi direction="up" kodumu kullanacağım, ama biraz da heigth değerini genişleteceğim.

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee direction="up" width="800" height="400" bgcolor="red">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    </marquee>
    </body>
    </html>


    Ama yukardaki kodumuzda resimler yan yana. Peki bunu alt alta nasıl yapabiliriz? Bunu da resimlerin arasına <br> kodumuzu koyarak yapabiliriz. <br> kodumuz enter görevini üstlenir burada ve biraz da marquee'nin width boyutu ile oynayacağım.

    <html>
    <head>
    <title>YASSAXLI</title>
    </head>
    <body>
    <marquee direction="up" width="100" height="400" bgcolor="red">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    <img src="1.jpg" width="100px" heigth="800px">
    </marquee>
    </body>
    </html>


    Eğer resimlerin arasına boşluk olmasını istiyorsanız &nbsp; kodu ile koyabilirsiniz. Ne kadar çok &nbsp; koyarsanız o kadar boşluk olur.

    Kolay gelsin. Umarım işinize yaramıştır. 

Hiç yorum yok:

Yorum Gönder