mehmetduran.com - Paylaşmak Güzeldir...
Jquery ile Değişir Alan Yapımı (Güncelleme)
Bu yazımda daha önce hazırlamış olduğum Jquery ile değişir alan uygulamasını bir arkadaştan gelen istek üzerine güncelledim. Bu uygulamada belirlediğimiz başlıklar tek tek değişiyor. Bu değişim sırasında mouse ile değişen alan üzerine geldiğimizde ve üzerinden çıktığımızda değişimi kontrol ediyoruz. Güncellemede bu kontrolü yaparak daha kullanışlı bir uygulama olarak sizlere sunuyorum. Mouse ile değişen alan üzerine geldiğimizde değişim olmazken, mouse ile üzerinden çıktığımızda değişim kaldığı yerden devam ediyor. Bu uygulama için ajax ile rss okuması yapan bir örnek hazırladım. Şimdi uygulamanın güncel kodlamalarına ve çalışır haline bakalım.

Daha önce de olduğu gibi uygulamanın html yapısında bir değişim yok. Html yapı aşağıdaki gibi olacak.

  <div id="alan">
    <a href="#">Haber, Rss Başlığı 1</a>
    <a href="#">Haber, Rss Başlığı 2</a>
    <a href="#">Haber, Rss Başlığı 3</a>
    <a href="#">Haber, Rss Başlığı 4</a>
  </div>

Bu yapıya uygun güncellenmiş Jquery kodlarımız ise aşağıdaki gibi olacak.

  <script type="text/javascript">
    var aktif = 1;
    var timer;
    $(document).ready(function(){
      $("#alan a").hide();
      $("#alan a:first").show();
      timer = setInterval(degistir,1500);
      /*Mouse Kontrolü*/
      $("#alan a").mouseover(function(){
          /*Mouse üzerinde ise durduruyoruz*/
          clearInterval(timer);
      }).mouseout(function(){
          /*Mouse üzerinden çıktığı anda devam ettiriyoruz*/
          timer = setInterval(degistir,1500);
      });
    });
    function degistir()
    {
      $("#alan a:nth-child("+aktif+")").slideUp(200);
      aktif = (aktif + 1) % $("#alan a").length;
      if(aktif == 0) aktif = $("#alan a").length;
      $("#alan a:nth-child("+aktif+")").slideDown(300);
    }
  </script>

Kodlarımız bu şekilde. Hazırlamış olduğum örneklerden ilki basit bir html sayfa ve yukarıda vermiş olduğum kodları aynen kullanarak bu örneği hazırladım. Bu sayfayı ve örneği buradan görebilirsiniz. Ajax ile rss okuma örneğini ise bu uygulama ile kullandım ve bir örnek hazırladım. Bu örnekte yukarıdaki kodları olduğu gibi kullandım ancak kullanım sırasında biraz değişim var. Bu değişimin nedeni ise verileri Ajax ile alıyor olmamızdır. Bu örneği ve kodları da buradan görebilirsiniz.

İki örneği de buradan indirebilirsiniz.

İyi Çalışmalar.
Mehmet Duran 03 Mayıs Pazar 2009 15 19658 4,2
Bookmark and Share
Bu Yazıyı Değerlendirin.
Konuyla İlgili Olabilecek Diğer Yazılar Learn C# (Includes the C# 3.0 Features) E-Book Jquery ile Basit Birkaç Örnek Uygulama (Karakter Saydırma) Asp.net MVC'de Dosya Upload İşlemleri (Multi Uploading) Javascript ile Menü Effect Jquery ile Asp.net Sayfasına Ajax İsteğinde Bulunma
Yorumlar
Yorum Yaz
RSS Yorum Takibi
Muharrem ERİN 04 Mayıs Pazartesi 2009 20:28 #1
İlgilenip bu örneği paylaştığınız için teşekkür ediyorum. İyi çalışmalar, başarılar...
ömer faruk 12 Mayıs Salı 2009 08:50 #2
kolay gelsin hocam. örneklerin gerçekten çok güzel. eger imkanın varsa veya arşivinde varsa sagdan sola kayan yazı veya resim olayı var mı? ama bu marquee den farklı. eminim birçok sitede görmüşsünüzdür. resimler belirli sürede duruyor ve kayma devam ediyor. sagında ve solunda bulunan butonlarla kaymanın yönü değiştirilebiliyor. www.e-sirket.com da vitrin firmalar tanıtım alanına benzer bir yapım. yardımcı olursanız cok memmun olurum.
Mehmet Duran 12 Mayıs Salı 2009 23:34 #3
Merhaba. Dediğin örneğin tam olarak aynısını yapmış değilim. Ancak yukarı doğru kayan bir örnek yapmıştım. Zaman bulduğumda örnek yapmaya çalışacağım. Yaptığımda da sitemde paylaşırım.
ismail 16 Eylül Çarşamba 2009 23:24 #4
üstad merhaba. yaptığınız örnekte(rss ile okuduğunuz) aynısını yapıyorum. masterpage te rss veriyi getirmiyor. eğer sayfayı masterpage e bağlamazsak veri o zaman geliyor
Mehmet Duran 17 Eylül Perşembe 2009 22:38 #5
Merhaba. Bunun için sitemde Ajax ile ilgili olan buradaki ve buradaki yazılarım sorunu çözecektir.
ismail 18 Eylül Cuma 2009 05:23 #6
üstad tavsiye sayfalara baktım. Aynen uygulamaya çalıştım olmadı. gerekli kodları webservice ve masterpage e head arasına ekliyorum.. head arasına eklediğiime de geçerli url yolunu giriyorum.(WebService.asmx/rss_getir) ve masterpage i me div kodunu ekliyorum. yine olmadı. :(
Mehmet Duran 18 Eylül Cuma 2009 20:11 #7
Yaptığın örnek nette varsa adresini gönderirsen bir de ben bakabilirim. Sorunun nerde olduğunu bulmak lazım. Öncelikle Ajax işleminin başarılı olup olmadığını gözlemlemek gerekir. Bunun için FireBug kullanmanı tavsiye ederim. Eğer Ajax işleminde problem yoksa problem seçicilerden kaynaklanıyordur.
ismail 18 Eylül Cuma 2009 23:47 #8
üstad deneme projemi rarlayıp attım.. bi bakarsanız sevinirim üstad. kolay gelsin iyi çalışmalar
Mehmet Duran 19 Eylül Cumartesi 2009 05:32 #9
jQuery kodlarda bir sıkıntı yok. Sıkıntı web service'te. Bir kere web service'e gerekli olan özellikleri atamamışsın. Ayrıca Web Service metodu static olmamalı. Buradaki yazımda kodalrını verdiğim şekilde web service'i düzenlersen ve rss okuyan metodu non-static yaparsan çalıştığını göreceksin.
ismail 19 Eylül Cumartesi 2009 20:52 #10
üstad çıkamadım işin içinden ya. bu işte yeni olduğumdan çok karışık geldi:S
Mehmet Duran 19 Eylül Cumartesi 2009 23:54 #11
Yaptığın örneğin linkini ve mail adresini gönderirsen çalışır halini sana gönderebilirim. İletişim bölümü veya mail ile gönderirsen sevinirim.
hacı kişi 29 Eylül Salı 2009 10:12 #12
Compiler Error Message: CS0501: 'rss.title.get' must declare a body because it is not marked abstract or extern Source Error: Line 43: public class rss Line 44: { Line 45: public string title { get; set; } Line 46: public string link { get; set; } Line 47: } yukardaki hatayı veriyor. framework2.0 kullanılorum.
Mehmet Duran 29 Eylül Salı 2009 10:55 #13
Merhaba. Hatanın nedeni framework 2.0 kullanmanız olabilir. Rss okuma kodlarında framework 3.0 ile gelen özellikleri (List<> yapısı) kullandım. Eğer projenize gerekli dll'i eklerseniz veya List<> yapısı yerine 2.0'da olan başka özellikleri kullanırsanız sorun çözülebilir. Ayrıca değişkenleri de framework 2.0'a göre tanımlanız gerekir.
Mehmet ÇOKTAY 02 Ekim Cuma 2009 15:53 #14
Merhaba.Bu örneği veri tabanından access 2003 veri tabanından alsak ve bir haber bandı gibi gösterme şansımız varmı acaba.Böyle bir örnek yaparsanız çok sevinirim.inanın böyle bir örneğe çok ihtiyacım var.yardımınızı bekliyorum.slmlar
Mehmet Duran 02 Ekim Cuma 2009 16:16 #15
Merhaba. Veritabanıyla yapmak için RSS okuma örneğini kullanabilirsin. Orada RSS'den aldığımız verileri veritabanından alcaksın. Tek fark bu ve rahatlıkla yapılabileceğini düşünüyorum. Örneklerin linkini verdim ve kodları görebilirsin.
İsim :
Site :
Yorum :

Buradan bu yazıya ait yorumları RSS olarak takip edebilirsiniz.

Bu servis ile yazılara eklenen yorumları RSS ile takip ederek konu ile ilgili başkaları tarafından yapılan yorumları veya konuyla ilgili sorduğunuz sorulara verilen cevapları görebilirsiniz.
Bazı yıkılışlar daha parlak kalkınışların teşvikçisidir.
Bölümler
Yazılar
Arşiv
Arama
Linkler
Site İçi Arama
Son Zamanlarda Ne Yapıyorum ?
İstatistikler - Araçlar - Reklam
İstatistikler
Sayaç
Mehmet Duran | mehmetduran.com | Copyright © 2009