Bazı jQuery Eklentileri ve Web Adresleri



1. Jcrop Eklentisi :


Jcrop, web uygulamalarınıza hızlı ve kolayca entegre edebileceğiniz bir imaj croplama eklentisidir. Örneğin sitenizdeki üyelere, profil resminin istediği bir bölümünü kesip kullanmasına imkan tanıyabilirsiniz..

  +  Jcrop demo ve örnekler
  +  Jcrop hakkında bilgiler
  +  Jcrop'u indir


2. PrettyPhoto Eklentisi :
Lightbox benzeri bir eklentidir, resim/fotoğraflarınızın animasyonlu bir şekilde açılmasını sağlar.

 +  PrettyPhoto demo
 +  PrettyPhoto indir


3. DynaCloud Eklentisi :
Web sayfanızda geçen kelimelere göre otomatik olarak etiket bulutu yaratan bir eklentidir.

 +  DynaCloud demo
 +  DynaCloud indir


4. Start/Stop Slider Eklentisi :
Web sayfanıza belli periyotlarla değişen içerik koyabilme imkanı yaratan bir eklentidir.

 +  Start/Stop Slider demo
 +  Start/Stop Slider hakkında
 +  Start/Stop indir


5. Simply Spy Eklentisi :
Web sayfanıza belli periyotlarla değişen içerik koyabilme imkanı yaratan bir eklentidir.

 +  Simple Spy demo
 +  Simple Spy hakkında


6. Popout Ad Eklentisi :
Web sayfanıza, ziyaretçilerinizi rahatsız etmeyecek şekilde popup olarak açılan reklamlar yerleştirmenize yarayan bir eklentidir.

 +  Popout Ad demo
 +  Popout Ad hakkında


7. Navigable & Horizontally Scrollable Portfolio Eklentisi :
Kullanışlı bir portfolio oluşturabilmenize olanak tanıyan bir eklentidir.

 +  Navigable + Horizontally Scrollable demo
 +  Navigable + Horizontally Scrollable hakkında
 +  Navigable + Horizontally Scrollable indir


8. Galleria Eklentisi :
Resim galeri eklentisidir.

 +  Gallleria demo
 +  Galleria hakkında
 +  Galleria indir


9. jTruncate Eklentisi :
Yazıyı istediğiniz yerinden budamanıza yarayan bir eklentidir. Örneğin 500 karakterlik bir yazı için sadece ilk 100 karakterini göster, kalanını "devamını göster" linkine tıklayarak görebilsin diyebiliyorsunuz..

 +  jTruncate demo
 +  jTruncate hakkında
 +  jTruncate indir

Keyifli şeyler umarım hoşunuza gider.

İyi Çalışmalar, Kolaygelsin.






Jquery Devam..


Merhaba Arkadaşlar;

Bu yazımda jQuery ile ilgili biraz daha detaya inmek istedim. jQuery'i sizlere sevdirmek için bütün özelliklerini yazmak, bütün özellikleri ile ilgili en azından bir örnek yapmak isterdim ama o zaman inanın bana bütün diğer konuları bırakıp aylarca sedece bu konuya zaman ayırmam gerekir, aslında fenada olmazdı ;)  jQuery benim gerçekten çok sevidiğim, daha önce değindiğimiz Mootools, Prototype vb.. JavaScript Library'ler içerisinde en keyiflisi "benim için" jQuery yazım şekline alıştıktan, kısa yolları, kütüphaneyi istediğiniz şekilde kullanmaya başladığınız zaman, sizinde benimle aynı duyguları hissedeceğinizden, bir web geliştirme aracı olarak hayatınıza gireceğinden eminim. Bu kadar muhabetten sonra artık başlayalım dimi :)

NOT: Bu gün tarihi itibari ile jquery-1.3.2.js sürümünü indirebnilirsiniz.

SELECTOR Yapıları;

jQuery farklı demiştik, $ işareti bizim bir çok işimizi görecek, jQuery ve HTML araçlarını birlikde kullanmak için öncelikle jQuery ile HTML elementlerini elde etmemiz gerekiyor. Bunu yapabilmek için jQuery'de cümlemize başlarken $ işareti kullanmalıyız ve HTML elementini ele alabilmemiz için ihtiyacımız olan'da bu.

Örnek kodumuza geçerek bunu biraz daha açıklamaya çalışayım.

<script src="jquery-1.3.2.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript>

 function İlkJquery(){

        $("#goster").text($("#div1").text());

}

</script>

---------

 <div id="div1">A. Sertay HALKA</div>

<div id="div2">Boran ŞENTÜRK</div>

<div id="goster"></div>

<input id="htmlButton1" type="Button" value="Göster" onclick="İlkJquery()" />

Açıklama: Öncelikle şunu belirteyim, kodu direk olarak buradan yazdığım için html - head - body gibi HTML taglarını eklemedim siz uygulamanızı yaparken lütfen eklemeyi unutmayım ;)

Öncelikle normal bir JavaScript function tanımladığımıza dikkat edim, orada bir sıkıntı yok. Onun haricindeki bölümde " $("#goster").text " olan yerden itibaren artık jQuery sorgumuzu yazmaya başladık. " # " işareti ile ona bahsettiğimiz HTML elementi goster'i jQuery ile bulmaya çalışıyoruz, buldukdan sonra sıra 2. element olan div1'e geliyor ve buradan da A. Sertay HALKA içeriğini alıp goster div elementine bunu atayarak bu div elementinin sayesinde göstermesini sağlıyor.

Bir de CSS'ler ile ilgli ufak bir örnekyapalım.

<style type="text/css">

        .goster { color:Lime; }

    </style>

    <script src="jquery-1.3.2.js" type="text/javascript"></script>

    <script language="javascript" type="text/javascript">

 function CSSJquery(){

     $("#goster").text("İkinci Jquery");

}

</script>

_-_-_-_-_-_-_

<div id="div1">A. Sertay HALKA</div>

 

<div id="div2">Boran ŞENTÜRK</div>

<div id="goster" class="goster"></div>

<input id="htmlButton1" type="button" value="Göster" onclick="CSSJquery()" />

 

jQuery Döküman ve Örnekleri

Arkadaşlar gerçekden sizde incelediğinizde göreceksiniz, gerçekden çok örnek var ve kullanımı bunlar kadar basit, mantığıda aynı, size verdiğim linklerden devamını öğrenebilirsiniz, eğer sıkıtı çekerseniz mutlaka bana mail atın, en kısa zaman da yanıtlarım.

İy Çalışmalar, Kolaygelsin.

 







Blog Posts' Cloud