Twitter Tarzı Son İletiler

 bcakir
 31 Ekim 2011

Merhaba arkadaşlar bu yazımda JQuery ile twitter tarzı son iletilerin kayarak aktığı haberler panosunu yapacağız. Bu uygulamayı sitenize ekleyerek son aldığınız yorumları ya da son yazdığınız yazılarınızı ana sayfanızda twitter gibi kayan yazıların olduğu bir pano içerisinde kolayca gösterebileceksiniz. Daha önceki uygulamalarımızda yaptığımız yibi yine hazır bir JQuery kütüphanesi kullanarak uygulamayı geliştireceğiz. Önemli olan bu tarz kütüphaneleri arayıp bulabilmek. Çünkü hepsinin sitede kullanıma yöntemi birbirine benziyor. Buna ilaveten, kullanacağımız hazır kütüphane ile birlikte gelen css, jpg gibi bazı dosyalar da var. Bundan dolayı yazımızın sonunda bütün içeriğin yer aldığı dosyayı sizinle paylaşacağım. Şimdi zaman kaybetmeden uygulamamızı geliştirmeye başlayalım.

<!DOCTYPE html>
<html>
<head>
<title>Twitter Tarzı Son İletiler</title>
</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="js/toptweet.jquery.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript">
$(document).ready(function(){
    $(".twtr-tweets").topnews({
        startstop:true,
        limit:10,
        move:'down'
    });
});
</script>
</head>
<body>
<div class="article">
    <div id="tweets">
        <h2>Son Gönderiler</h2>
        <div class="twtr-bd">
            <div style="height: 340px;" class="twtr-timeline">
                <div class="twtr-tweets"></div>
            </div>
            <div class="twtr-fade"></div>
        </div>
    </div>
</div>
</body>
</html>

Uygulamamızın pano kısmını yani son gönderilerin gösterilme kısmını yaptık. Şimdi de son gönderilenlerin alınması kısmını yapacağım. Ben herhangi bir veritabanı kullanmayacağım. Ama siz bu kısma veritabanınızdan son yorumların veya yazıların alınmasını eklemeniz gerekiyor. Çünkü onları göstermek istiyorsunuz. Ben sadece mantığını anlattığım için 1. içerik, 2. içerik tarzında elle girilmiş yazılar gireceğim. Bu kısmı, daha önce anlattığım MySQL veritabanına bağlanma ve kayıt alma konusuna bakarak kolayca geliştirebilirsiniz. Bu önemli açıklamayı da yaptığıma göre şimdi Php kısmını geliştirelim.

<?php
//veri.php olarak kaydedin
//bu betiği veritabanından içerik alma şeklinde değiştirin
for($i=0;$i<20;$i++){
    $msg[]="$i. icerik";
}
echo implode("~",$msg);
?>

Uygulamamızda gösterilecek içeriklerin alınma işlemini yukarıda yaptık. Böylece bir uygulamamızın daha sonuna geldik. Uygulamanın bütün içeriğinin olduğu dosyayı buradan indirebilirsiniz. Yararlı bir uygulama olması dileğiyle.

 1.701 Okunma

Bu yazıya 3 yorum yapılmış.

  1. Merhaba, Bana Yardımcı Olabilirmisiniz?
    şöyle anlatayım, http://orhangenc.com/Avansas/x/y/01010101.php linkinde yapmaya çalıştığım hem post ile veriyi yazmak hemde fotoğrafı yüklemek. ancak fotoğrafın yükleneceği klasör benzersiz isim yani ürün Id olacak ama beceremedim :/
    Yardımcı olurmusun lutfen daha yeni başladım php’ye, şimdiden teşekkür ederim.
    orhangenc@w.cn
    orhngnc@gmail.com
    info@orhangenc.com

  2. yardımınız için teşekkürler.

Yazı hakkında görüşlerinizi belirtmek istermisiniz?

Daha fazla JQuery, Php
Kapat