Neler yeni
Türkiye'nin En Güncel Forum Sitesi

Forum içeriğine ve tüm hizmetlerimize erişim sağlamak için foruma kayıt olmalı yada giriş yapmalısınız. Forum üye olmak tamamen ücretsizdir.

Otomatik Geçişli Yazı Oluşturmak

Bezelye

♫♪ Deniz üstü köpürür ♪♫, Hey canım rinnan nay ri
MFC Üyesi
  • Üyelik Tarihi
    25 May 2016
  • Mesajlar
    5,364
  • MFC Puanı
    2,813
  • MFC Seviyesi

Bu yazıda sayfa yenilememize gerek kalmadan, belirleyeceğimiz süre aralığında kendiliğinden değişen yazılar oluşturacağız. Bunu web sitenizin pek çok farklı alanında kullanabilirsiniz.
  • Mesela;
    • Özlü sözler bölümü,
    • Kullanıcılara yapacağınız önemli duyurular,
    • Son dakika haberleri,
    • Duyurularınız vb.

Nasıl Yapılır?
jQuery özelliklerinden faydalanarak yapacağız. Aşağıdaki adımları takip ederek kolayca web sitenizdeki istediğiniz yere ekleyebilirsiniz. İlk olarak kullanacağımız jQuery kodlarını sistemimize tanımlamamız gerek. Bunun için sayfanızdaki
HTML:
</head>
kodundan önce şu kodları eklemelisiniz:
HTML:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.innerfade.js"></script>
<script type="text/javascript">
       $(document).ready(
                function(){
                    $('.yazi').innerfade({
                        animationtype: 'fade',
                        speed: 750,
                        timeout: 5000,
                        type: 'random',
                        containerheight: '20px'
                    });
            });
</script>

<link rel="stylesheet" type="text/css" href="style.css" />

Böylece jQuery kodlarımızı tanımladık, şimdi sıra web sayfamızda görünecek kodları yerleştirmekte. Bunun için de;
HTML:
<div class="yazi">                    
<span class="yazitipi">"Ümidini kaybetmiş olanın başka kaybedecek bir şeyi yoktur. (Bois) "</span>
<span class="yazitipi">"Verilmesi en kolay şey nasihat.alınması en güç şey ibrettir. (Droz)"</span>
<span class="yazitipi">"Ya başlamamalı ya da bitirmeli. (Ovidius)"</span>
<span class="yazitipi">"Fikirlerini ve söylediklerini asla kabul edemem...Ama onları söyleme hakkını ölünceye kadar savunurum... (Voltaire)"</span>
<span class="yazitipi">"Aptalın sevgisi ayının sevgisidir; kini sevgidir,sevgisi kindir. (Mevlana)"</span>
<span class="yazitipi">"Boşuna kendinizi kandırmayın; sürekli yaptığınız şey neyse siz osunuz. (Aristo)"</span>
<span class="yazitipi">"Yaşanırken heyecan duyulmayan işler başarılamaz. (Emerson)"</span>
<span class="yazitipi">"Yaşadığımız her an kendi hakkını ister. (Goethe)"</span>
<span class="yazitipi">"Yaşamak için yemelisin,yemek için yaşamamalısın. (Cicero)"</span>
<span class="yazitipi">"Yaşamın uzunluğu değil,nasıl yaşanıldığı önemlidir. (M.L.King)"</span>
<span class="yazitipi">"Ayakta ölmek,diz üstü yaşamaktan daha iyidir. (G.Washington)"</span>
<span class="yazitipi">"Adalet topaldır,ağır ağır yürür,fakat gideceği yere er geç varır. (Mirabeau)"</span> 
<span class="yazitipi">"Birini taklit etmek onu övmenin en samimi şeklidir. (Colton)"</span>
<span class="yazitipi">"Başarılarını gizlemek en büyük başarıdır. (La Rochefoucauld)"</span>
<span class="yazitipi">"Başkalarını hep bağışla,kendini hiç bağışlama. (Syrus)"</span>
<span class="yazitipi">"Çalisana hakkini teri kurumadan önce veriniz. (Anonim)"</span>
<span class="yazitipi">"Bu dünyada insanlar bir kere aldatılınca gerçekten bile şüphe duyarlar. (Hitopedesa)"</span>
<span class="yazitipi">"Anı yazmak ölümün elinden bir şey kurtarmaktır. (Andre Gide)"</span>
<span class="yazitipi">"Zamanında bir adım atmayan tembel,sonradan yüz adım atmak zorunda kalır. (Giovio)"</span>
<span class="yazitipi">"Felaket gibi hoca az bulunur.Felaket zakayı eğitir. (Anonim)"</span>
<span class="yazitipi">"Alkışı en sessiz karşılayan,alkışı haketmiş demektir. (Emerson)"</span>
<span class="yazitipi">"Alkış zayıfların amacı ve sonudur. (C.Colton)"</span>
<span class="yazitipi">"Yiğitlik intikam almak değil,tahammül etmektir. (Shaekespeare)"</span>
<span class="yazitipi">"Yaşamın gayesi; hoşa gitmeyen şeylerden kaçmak değil,hoşa gitmeyen şeyleri yenmektir. (Forester)"</span>
<span class="yazitipi">"Büyük işler sanki hiç ölmeyecekmiş gibi çalışmakla başarılabilir. (Vanvenarues)"</span>
<span class="yazitipi">"Deniz gibi mal kazan,fakat sen üzerinde gemi ol. (Mevlana)"</span>
<span class="yazitipi">"Can sıkıntısı dünyaya tembellikle beraber gelmiştir. (LaBruyere"</span>
<span class="yazitipi">"Akıllı adam aklını kullanır.Daha akıllı adam başkalarının da aklını kullanır. (BernardShaw)"</span>
<span class="yazitipi">"Başkalarının bilgisi ile bilgin olsak bile ancak kendi aklımızla akıllı olabiliriz. (Montaigne)"</span>
<span class="yazitipi">"Herkes kendi mutluluğunun demircisidir. (Anonim)"</span>
<span class="yazitipi">"Kim bilir... masalınızın kahramanı, başka bir hikayede figüran olmaya gitmiştir belki de ...  - Nazım Hikmet."</span>
<span class="yazitipi">"İnsan olduğunuzu hatırlayın, geriye kalan her şeyi unutsanız da olur. - Albert Einstein." </span>
<span class="yazitipi">"Dünya korkunç değil ama korkunç insanlarla dolu -Jonathan Safran Foer."</span>
<span class="yazitipi">"En iyi adamlar yalnızken güçlüdür. -C.Bukowski."</span>
<span class="yazitipi">"Az kişi hatta bir tek kişinin ruhuna dokunmak bile dünyayı değiştirmektir. - Eddi Anter."</span>
<span class="yazitipi">"Gitmek gerekir bazen, fazla yormadan, daha çok bıktırmadab. Eğer vaktiyse, ardına bile dönüp bakmadan... -Can Yücel."</span>
<span class="yazitipi">"Yeni bir ateş söndürür başkasının yaktığını, yeni bir acıyla hafifler eski bir ağrı. -Shakespeare."</span>
<span class="yazitipi">"Ben bilmediğimi bildiğim için öteki insanlardan akıllıyım. ( Sokrates )"</span>
<span class="yazitipi">"Felaket gibi hoca az bulunur.Felaket zekâyı eğitir. (Anonim)"</span>

</div>

yukarıda derlenen sözler yerine sizde kendi ekleyeceğiniz içeriği ekleyebilirsiniz.

Yazı Tipi Düzeni
Yazı tipini style.css dosyasında tanımladık. Eğer değiştirmek isterseniz yazı tipinizi, boyutunuzu vb. style.css dosyasından değiştirebilirsiniz.

Geçiş Ayarı
Geçişler süre olarak milisaniye cinsinden belirlenmiştir. Örnek olarak her yazının beş saniyede bir geçmesini istiyorsanız, 5000 demelisiniz.

animationtype: 'fade', Geçiş efekti belirlemek için kullanılır. Eğer yazıların soluklaşarak değilde kayarak geçmesini istiyorsanız 'fade' yerine 'slide' yazın.
speed: 750, Animasyon hızıdır. 0,75 saniyeye eşittir.
timeout: 5000, Yazının ekranda kalacağı süredir. 5 saniyeye eşittir.
type: 'random', Gösterim sırası, sıralı gösterim için 'sequence', karışık gösterim için 'random' yazın.
containerheight: '20px', Yazıların gösterileceği alanın yüksekliği.

Dosyalar eklenti şeklinde eklenmiştir. Düzenlemek ve kullanmak için indirebilirsiniz.

Ekran görüntüsü:
 

Ekli dosyalar

  • dosyalar.zip
    19.5 KB · Görüntüleme: 0
Üst Alt