HTML KAYAN RESİM VE Marguee KULLANIMI
Birşeyi kaydırmak için gerekli kodumuz:<marquee></marquee> şeklindedir. Örneğin WEBCEBİR.COM yazısını html sayfada kaydırmak için marquee WEBCEBİR.COM /marquee komutunu kullanırız.
Resim kaydırmada işlemi yazı kaydırma işleminden hiçbir farkı yoktur.
Soldan sağa Kayan Resim
<marquee direction="right"> <img src="ari.png"></marquee>
Sağdan sola Kayan Resim
<marquee><img src="ari.png"> </marquee>
Sağdan Sola ve Soldan Sağa Kayan Resim
<marquee behavior="alternate"> <img src="ari.png"></marquee>
Yukarıdan Aşağıya Kayan Resim
<marquee scrollamount="1" height="50" width="100%" direction="down" style="height: 50px; width: 100%;"> <img src="ari.png"> </marquee>
Aşağıdan Yukarıya Kayan Resim
<marquee scrollamount="1" height="50" width="100%" direction="up" style="height: 50px; width: 100%;"> <img src="ari.png"> </marquee>
Çoklu Resim kaydırma
Üç tane resmi yanyana kaydıralım.
<marquee behavior="alternate" bgcolor="#ff6600 " style="background-color: rgb(255, 102, 0);"> <img src="ari.png"> <img src="ari.png"> <img src="ari.png"> </marquee>
NOT:
Resim hangi dizinde bulunuyorsa bu resim ana dizinde bulunduğu için böyle gösterdik. src=”ari.png” images klasöründeyse şöyle gösterilir src=”images/ari.png”Ama yukardaki kodumuzda Peki bunu alt alta nasıl yapabiliriz? Bunu da resimlerin arasına
kodumuzu koyarak yapabiliriz.
kodumuz enter görevini üstlenir burada ve biraz da marquee’nin width boyutu ile oynayacağım.
<html> <head> <title>Kayan Yazı Sanalkurs</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>
RESİMLERİ AŞAÃIDAN YUKARI KAYDIRMAK
Ben şimdi resimleri aşağıdan yukarı doğru kaydırmak istiyorum. 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>Kayan Yazı </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>