Merhaba arkadaşlar uzun bir süredir düzgün bir paylaşım yapamıyordum, tembelliği üstümden attım ve yoğun istek üzerine ilk yazdığım jquery popup uygulamasını yeniden yazdım ve eklenti haline getirdim.
Yenilikler neler ?
1 Açılış
İstenilen butona tıklayınca açılma veya otomatik açılma.
Popupun pozisyonunu belirleme, bu kısımda iki seçenek var 1 ortala, orta 2 ortala,top,100px
Arka planda renk ve opacity ayarlama
2 Kapanış
İstnilen butona tıklayınca kapanma
Esc ye basında kapanma
Arka plana tıklayınca kapanma.
Kullanım kolay mı ?
Evet kullanımı çok kolay.
Yapmanız gerekenler ;
1- İndirdiğiniz dosyayı ftpnize atmak,
2- Css/js dosyalarını sayfanıza ekmek,
3- Popupu koyacağınız sayfaya 2 ufak ekleme yapmak.
3.a Html taglarını kendinize göre düzenleyip sayfanıza yerleştirmek
3.b
tagları arasında eklentimizi çağırmak
Tüm işlemler bu kadar.
Eğer profesyonel bir kullanım istiyorsanız eklentimizi çağırırken kendi özelliklerinize göre eklentiyi çağırabilirsiniz.
Demo 1 = Tıklama ile ortalanmış bir şekilde açılma,
Demo 2 = Otamatik açılış ve arka plan değiştirme,
Demo 3 = Tıklama ile açılış, arka plan değiştirme, top değerini belirtme.
Eklentiyi İndir
Kaynak : jQuery popup eklentisi v2
1 Açılış
İstenilen butona tıklayınca açılma veya otomatik açılma.
Popupun pozisyonunu belirleme, bu kısımda iki seçenek var 1 ortala, orta 2 ortala,top,100px
Arka planda renk ve opacity ayarlama
2 Kapanış
İstnilen butona tıklayınca kapanma
Esc ye basında kapanma
Arka plana tıklayınca kapanma.
Kullanım kolay mı ?
Evet kullanımı çok kolay.
Yapmanız gerekenler ;
1- İndirdiğiniz dosyayı ftpnize atmak,
2- Css/js dosyalarını sayfanıza ekmek,
3- Popupu koyacağınız sayfaya 2 ufak ekleme yapmak.
3.a Html taglarını kendinize göre düzenleyip sayfanıza yerleştirmek
Kod:
<!-- ================================================ -->
<!-- ! abPopup baslangic -->
<!-- ================================================ -->
<div id="abPopup">
<div id="ab-ust">
<a id="ab-kapat" href="#">Kapat</a>
<h2 id="ab-baslik">abPopup uygulaması 2. versiyon ~ aycan.net</h2>
</div>
<!-- ab-ust DIV kapanis -->
<div id="ab-orta">
<img src="kutuphane/resim/aycan.jpg" alt="aycan bülbül" />
Lorem Ipsum is simply dummy text of the printing and typesetting industry <a title="dizin" href="http://www.xotesi.net/">xotesi.net </a> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div>
<!-- ab-orta DIV kapanis -->
<div id="ab-alt">
Üretken site : <a title="aycan.net" href="http://www.aycan.net/"> aycan.net</a></div>
<!-- ab-alt DIV kapanis --></div>
<!-- abPopup DIV kapanis -->
<!-- ================================================ -->
<!-- ! abPopup bitis -->
<!-- ================================================ -->
Kod:
<script type="text/javascript"><!--mce:0--></script>
Kod:
<script type="text/javascript"> $('#abPopup').abPopup();</script>Eğer profesyonel bir kullanım istiyorsanız eklentimizi çağırırken kendi özelliklerinize göre eklentiyi çağırabilirsiniz.
Kod:
<script type="text/javascript">
$(function() {
$('#abPopup').abPopup
({
'acilis' : 'tiklama',
'pozisyon' : 'ortala,ortala',
'arkaplan' : '#bebebe',
'arkaplanSaydam' : '0.6',
'htmlTag' : '#ab-kapat',
'siyahCerceve' : true,
'esc' : true
});
});
</script>Demo 1 = Tıklama ile ortalanmış bir şekilde açılma,
Demo 2 = Otamatik açılış ve arka plan değiştirme,
Demo 3 = Tıklama ile açılış, arka plan değiştirme, top değerini belirtme.
Eklentiyi İndir
Kaynak : jQuery popup eklentisi v2
