21
Kasım

Yazan: WEBMASTERYOLCU  |  Kategori: Uygulamalı Html Dersleri  |  Okunma: 17.253 Defa

Merhaba değerli arkadaşlar bugünkü dersimiz kayan yazılar ve kayan resimler yapacağız ve bunların özelliklerini tanıyacağız.

html derslerimizin son 2 dersine girmiş bulunmaktayız bundan sonraki dersimizde sayfamıza müzik ve video ekleyi gördükten sonra wordpress site kurulum dersleri,ne başlayacaz geniş kapsamlı olarak wordpress kurmamızda gerekli araçlar ftp, cpnal, veritabanı öğrenerek kuracaz daha sonra wordpress ayar ve temalarda ise css öğüreneceğiz mükemmel hale geleceksiniz.

Önceki Dersimiz: Web Tasarım Dersleri Çerçeve ve İframe Uygulama Ders 18

Kayan Nesneler

Web sayfamızın istediğimiz yerine kayan yazı ve resim ekleyebiliriz nerde kullanılır derseniz haber kısmı duyurular akıcı şekilde hoş olur.

<marquee>

Marquee etiketini kullanarak kayan yazı eklenebilir arkadaşlar. basitçe eklenebildiği gibi bir çok özellik atanabilir buyrun şimdi en basit kayan yazı uygulaması yapalım.

<html>
<head>
<title>Web Tasarım Dersleri Kayan Yazılar Ders 19</title>
</head>
<body>

<marquee> Webmasteryolcu.com Hoş Geldiniz </marquee>

</body>
</html>

evet arkadaşlar çok basit şekilde anlattım standart halini <marquee> Webmasteryolcu.com Hoş Geldiniz </marquee> yani marqueeler arasında kalan yazı ve resim kodları kayar hale geliyor peki birde kayan resim yapalım

Kayan Resim

<html>
<head>
<title>Web Tasarım Dersleri Kayan Yazılar Ders 19</title>
</head>
<body>

<marquee> <img src=”resimadi.jpg”> </marquee>

</body>
</html>

evet arkadaşlar yine basitçe kayan nesne kısmına resim kodumuzu eklemek yeterli olmuştur.

Kayan Yazıların 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ı istiyoruz bu durumda marquee parametrelerini kullanacağız nedir bunlar hemen aşağıda görelim.

Direction

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.

  • 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 ise yazılar yukardan aşağı doğru hareket eder

Direction Uygulaması

Evet arkadaşlar kayan yazımızın özellikleri oluşmaya başladı ben örneğimde sadece Down kullanacam yukardan aşağı kaymasını isteyerek siz diğer özellikleride uygulayarak görünüz.

<html>
<head>
<title>Web Tasarım Dersleri Kayan Yazılar Direction Ders 19</title>
</head>
<body>

<marquee direction=”down”> Yukardan Aşağı Kayan Yazı </marquee>

</body>
</html>

Hiçte zor değil gördüğünüz gibi down kısmına ister left, right, yada up eklenerek yön belirlenir.

Kayan Yazılarda Hız Ayarı

Kayan yazı yaptık yönde belirledik ama bitmedi baktıkki yazımız hızlı gibi yada yavaş yada bir süre sonra artık geçmesin dursun onun içinde aşağıdaki parametreleri kullanacağız.

  • 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.
  • Scrolldelay: yazının kayma hızını ayarlar dikkat etmeniz gereken değer büyüdükçe hız düşer değer düştükçe hız artar.

Kullanımlarını göstereceğim diğer özellikler gibi eklenerek değer belirtilmeli

<marquee loop=”5″> Kaç Defa Kayacağını Belirler </marquee>

<marquee scrolldelay=”20″> Kayan Nesne Hızını Belirler </marquee>

Evet arkadaşlar bugünkü dersimizde bu kadar bir sonraki dersimizde ses, müzik video eklemeyi görecez ve html son dersimiz artık wordpress ile site yapmaya başlayacaz onun içinse ayrıca konu açıp bilgilendireceğim sizleri Allaha emanet olun.

Derslerimi yazılarımı dilediğinizce paylaşabilirsiniz www.webmasteryolcu.com şeklinde kaynak belirterek



   Paylaş

4 Yorum yapılmış

  • 21 Aralık 2010 | Cevapla

    Evet çok güzel.
    Bu arada ücretsis ve hazır vbulletin forumu istiyorum.
    bana ulaşın enesenes99@hotmail.com teşekkürler.

  • web tasarım
    11 Ocak 2011 | Cevapla

    tşkler

  • Bilgipatlamasi
    25 Mayıs 2015 | Cevapla

    Hocam ellerinize sağlık tüm derslerinizi uygulayarak ve anlayarak öğrendim Allah sizden razı olsun.

Yorum yapın