jQuery Design

Tanıtım: Sinerji Notebook Servisi

jD — Mon, 09 Jan 2012 23:10:45 +0000

Merhaba,bugün sizlere notebook servisi konusunda ufak bir tanıtım yazısı yazacağım.Sinerji notebook servisi notebooklarınız için açılmış bir hizmet sitesi.Notebook ve laptop servisleri konusundada hizmet alabileceğiniz yerlerden biriside sinerji notebook servisi ile detaylara ulaşabilirsiniz. Sistemi ziyaret etmek ve bilgi almak isterseniz eğer sinerji notebook servisi

Yeni Başlayanlar için jQuery Dersleri 2: animate() Metodu

jD — Fri, 24 Jun 2011 00:55:17 +0000

Merhabalar.. Çok uzun bir zaman geçti fakat yeni başlayanlar için jQuery Video Dersleri serisini sürdürüp bu konuyu kapatmak istedik. İkinci ders olarak sizlere jQuery animate() metodunu basit bir şekilde kullanarak öğretmeye çalıştık.

jQuery Animate metoduyla herhangi bir nesneye click fonksiyonuyla bir animasyon kazandırdık.

Click fonksiyonu belirlenen nesneye tıklanmasıyla (this).animate komutundan sonra gelen left, right, height veya width gibi değerlerle o neseneye animasyon kazandırılır. left ve right gibi yön belirten terimler nesneyi hareket ettirirken width ve height gibi büyüklük belirten terimler ise nesnenin boyutunu yeniden şekillendirir.

Video’yu izleyerek daha iyi anlayabilirsiniz. Umarım yardımcı olabilmişimdir.

jQuery ile Hesap Makinesi Yapımı

jD — Sun, 12 Jun 2011 12:42:09 +0000

Merhabalar..

Bu konuda jQuery ile hesap makinesi yapımından bahsedeceğiz.

Birazdan oluşturacağımız Hesap makinesinin arayüzünde 1′den 9′ a kadar sayı butonları ve birkaç işlem butonu ve son olarakta eşittir butonumuz yer almakta.. Aslında olay tamamen markup üzerinden geçmekte, jQuery ise sadece stillendirmemize ve fonksiyon oluşturmamıza olanak sağlıyor.

Fazla vakit kaybetmeden markup’a bir göz atalım isterseniz;

Markup

Yukarıda da dediğim gibi, 1′den 9′a kadar sayılarımız ve işlem fonksiyonlarımız markupa input şeklinde yerleştirilmiş.

Pekala bunlara birer stil kazandırmak hiç de fena olmaz.. İlk olarak resimlerimizi çizebilmek için Photoshop programını kullanabilirsiniz, ya da zaten download linkinde bulunan resimleri de kullanabilirsiniz. Bizim kullanacağımız resim şu şekilde;

Fazla uzatmak istemiyorum,yukarıda hesap makinesinin arka planı, tuşlar için yuvarlak butonlar ve bunların hover efektli hali,bir eşittir butonu ve LightBox için kapama görselimiz hazır.

Şimdi Css ile stillendirelim;

*				{ margin: 0; padding: 0; }
body				{ font: 25px "Arial Black", Arial, Sans-Serif; }

#page-wrap		    	{ width: 500px; margin: 25px auto; }

h1				{ font-size: 22px; }
p				{ font: 14px Arial, Sans-Serif; }
a				{ color: black; text-decoration: none; outline: none; }

#calculator			{ width: 266px; height: 400px; background: url(../images/calc-bg.png) no-repeat;
	 			  position: relative; display: none; }

#display 			{ background: none; border: none; position: absolute;
				  top: 15px; left: 15px; width: 197px; text-align: right;
			  	  font: 35px "Arial Black", Arial, Sans-Serif; }

.num-button			{ width: 44px; height: 41px; padding: 3px 0 0 0; text-align: center;
	 		      	  background: url(../images/button-bg.png) no-repeat;
				  position: absolute; display: block; }
.clear-button			{ width: 44px; height: 41px; padding: 3px 0 0 0; text-align: center;
	 		          background: url(../images/button-bg.png) no-repeat;
				  position: absolute; display: block; }
.function-button    		{ width: 44px; height: 41px; padding: 3px 0 0 0; text-align: center;
	 		          background: url(../images/function-button-bg.png) no-repeat;
				  position: absolute; display: block; }
.function-button:active,
.pendingFunction    		{ background-position: bottom left; }

.seven				{ top: 86px; left: 15px; }
.eight				{ top: 86px; left: 66px; }
.nine				{ top: 86px; left: 118px; }

/* ... the rest of the buttons ... */

.multiply			{ top: 188px; left: 169px; }
.divide				{ top: 237px; left: 169px; }

.equals-button			{ width: 206px; height: 42px; text-align: center; top: 293px; left: 15px;
	 			  background: url(../images/equals-bg.png) no-repeat; position: absolute;
				  display: block; }

Bu stil çalışmalarımızın çooğunluğu farkettiyseniz position: değerinden geçmektedir. Position değeri ile resimlerin yerlerini ayarlayabiliyoruz.

Gerekli jQuery Scriptleri;

jQuery Fonksiyonları;

Asıl konumuz olan jQuery ile bu hesap makinesine fonksiyon atamak diye düşünebilirsiniz, oysa yukarıda da dediğim gibi amaç aslında şekillendirmek ve HTML ile klas bir görüntü kazandırmaktı.. Hesap işlemlerimizi Javascriptler ile halledeceğiz. Burada önemli olan şey, hesap işlem görüntüsünün jQuery sayesinde ekrana yazdırılmasıdır;

$(function(){

	$(".num-button").click(function(){
		// do stuff
	});

	$(".clear-button").click(function(){
		// do stuff
	});

	$(".function-button").click(function(){
		// do stuff
	});

	$(".equals-button").click(function(){
	     // do stuff
	});

	$("#calculator").draggable();

	$("#opener, #closer").click(function(){
		$("#opener").toggle();
		$("#calculator").toggle();
	});

Nihayi kodumuzdan sonra da Download linkinde bulabileceğiniz hesaplama scriptleriyle de karşılaşacaksınız.

Görüşmek üzere.

Filtrelenebilir jQuery Portföy Scripti

jD — Sat, 04 Jun 2011 17:56:06 +0000

Bir çok web sitesi artık Porföy şablonlarından oluşmakta ve her yeni gün yeni bir portföy şemasıyla karşılaşmaktayız..

Bugün sizlere tutsplus aracılığıyla tanıştğım jQuery Pörtföyünden bahsedeceğim.

jQuery Portföyü sayesinde Portföy görünümünüzü kategorilendirebilir, ve o jQuery‘e has yumuşak geçiş efektiyle sitelerinizi canlandırabilirsiniz.

1-) Markup

jQuery Portföyünün oluşturduğu ana HTML teması şu şekilde;


 A List Apart
 Apple
 CNN
 Digg
 ESPN
 Facebook
 Google
 Netflix
 NETTUTS
 Twitter
 White House
 YouTube

2-) Portföyü Kategorizelendirme

Demoda 5 adet kategori kullanılmış.

Design
Development
CMS
Integration
Information Architecture

Burada kullanılan kategorileri kendi isteğinize göre değiştirebilirsiniz.

3-) Kategori Navigasyonu Ekleme

Aşağıdaki kod Markupun içerisinde bulunan Kategorilere aittir.


 All
 Design
 Development
 CMS
 Integration
 Information Architecture

All yazan kısım tüm kategorileri gösterir.

4-) jQuery

jQuery dökümanı ise daha önce anlattıığ addClass, RemoveClass hareketleri ile kategorizelendirmeyi sağlıyor.

fadeIn metodu removeClass’ı desteklediği gibi tam tersini de yapabilirdi. Bu sizin kod yeteneğinize ve yaratıcılığınıza bağlı. Aynı zamanda burada ALL denilen tüm kategorileri göstermesi için scripten arınmış tuvali görmekteyiz.

fadeOut ve fadeIn için güzel de bir örnek teşkil ediyor.

$(document).ready(function() {
 $('ul#filter a').click(function() {
 $(this).css('outline','none');
 $('ul#filter .current').removeClass('current');
 $(this).parent().addClass('current');

 var filterVal = $(this).text().toLowerCase().replace(' ','-');

 if(filterVal == 'all') {
 $('ul#portfolio li.hidden').fadeIn('slow').removeClass('hidden');
 } else {
 $('ul#portfolio li').each(function() {
 if(!$(this).hasClass(filterVal)) {
 $(this).fadeOut('normal').addClass('hidden');
 } else {
 $(this).fadeIn('slow').removeClass('hidden');
 }
 });
 }

 return false;
 });
});

Geniş Açıklamalı jQuery Animasyon Dersleri

jD — Sun, 15 May 2011 06:09:13 +0000

Merhabalar.. Bugün itibariyle farkettik ki jQuery konusunda verilen dersler, bloglarda yapılan; insanlara sunulan konular hep yetersiz kalıyor.. Sürekli bir bocalama ve sürekli yardım desteklerinden artık bizler de yorulduk.. Bunu iki sebebe bağlayabiliriz; Birincisi insanımızın her zaman kolaya kaçma alışkanlığı, diğeri; bizim yetersizliğimiz..

Ortada sonuca ulaşabilmek için doğru bir yol çizemeyişimizin amacı da burdan kaynaklanıyor.. Bu kararı veremememiz.. Şayet birinci seçenek doğru olsa bile,biz kendimizi yetersiz görüyoruz. Bu amaçla da Animation adında yeni bir kategori oluşturarak sizlere baştan sona animation nasıl oluşturulur, nelere dikkat edilmesi gerekir ve tüm methodlar nasıl kullanılır bunu açıklamayı istedik.. Dediğim gibi yine en baştan alacağız ve birebir örneklerle bunları açıklamaya çalışacağız.

İlk olarak Animasyon nedir, Web Animasyonları nasıl ortaya çıkmıştır konusuna değinelim;

Animasyon, birkaç resmin arka arkaya hızlı bir şekilde gösterilmesiyle elde edilen hareketli görüntüdür. Geçmişte animasyonlar birkaç kağıda istenen resimlerin çizilmesi ve kâğıtların hızlıca geçirilmesi veya bir çemberin içine konup döndürülmesi ile yapılıyordu.

Günümüzde bilgisayar teknolojisi hem vektör hem de piksel tabanlı animasyonlar yapılmasına olanak sağlamaktadır. 2D animasyon tekniğinde saniyede 12 kare çizilerek yapılır. Limited animasyon tekniğinde ise daha az kare çizilerek yapılmaktadır. Bir animasyon filmi yapılmadan önce karakter tasarımları arkasından senaryonun storyboard çalışması ve en son layout çalışması yapılmaktadır. Profesyonel bir şekilde yapılması planlanan bir animasyon filmine bu aşamalar geçilmeden başlanamaz. Animasyon teknikleri son zamanlarda yapılan işlerle teknikte sınır tanımadığını göstermiştir. Fakat genel olarak kategorize etmek gerekirse 3D, 2D, stop motion, cut-out en yaygın tekniklerdir.

Kaynak

jQuery ile Animasyon;

jQuery ve jQuery UI kütüphanesi kullanılarak oluşturulabilen nesnelerin bir birleriyle ya da kaynakla ilişkilerini en basit yol ile oluşturabilme methodudur. Bunun sayesinde jQuery kütüphanesinde birçok method kullanılır.. Bunlar;

animate()
clearQueue()
delay()
dequeue()
fadeIn()
fadeout()
fadeTo()
fadeToggle()
hide()
queue()
show()
slideDown()
slideToggle()
slideUp()
stop()
toggle()

Tüm bu methodları kullanarak jQuery ile Çok güçlü web sayfaları yapabileceğimizi zaten diğer yazılarımızda okumuş olmalısınız.. Fakat bu metodları en başta nasıl kullanabileceğimizi öğrenmemiz gerekiyor.. Bunun için sizlere bir sıralı ders oluşturacağız ve tüm bu dersleri kendi kaynaklarımız dahilinde örneklerle açıklayacağız.. Umarım sizlere bir katkısı bulunur.. İlk dersimiz basit bir yükleniyor (loading image) resmi nasıl oluşturulur, bunu göstereceğiz.. Görüşmek üzere..

jQuery ile Düzenlenebilir Dinamik İçerik Oluşturma

jD — Tue, 10 May 2011 01:35:36 +0000

Bu dersimizde jQuery UI fabrikasını kullanarak nasıl Düzenlenebilir, Dinamik içerik sistemi oluşturacağımızı anlatacağım.

Düzenlenebilir İçerikten kasıt, içeriğe yerleştirilecek bir kaç düğme ile içeriği silmek, değiştirmek, gizlemek gibi emirlerle web sitesini kullanıcıın emrine bırakmak diyebiliriz. Demo’yu da incelerseniz daha iyi bilgi edinebilirsiniz.

Bileşen Planı Oluşturma

Kod yazmya başlmadan önce ilk olarak sayfamızın ana temasını çizebilmek için 3 adet bileşen kullancağız. Bunlar

options{…}

Bu nesne sayesinde bizim eklediğimiz özellikler ile kullanıcılar nesnelere, bizim izin verdiğimiz ölçüde dilediklerini yapabilecekler. Silme, geri çağırma vs..

_create()

Bu alan ise bizim kurulum ayarlarlarımızda geçerlidir. Sadece ilk başta çalışır. DOM gibi düşünülebilir.

_destroy()

Yukarıdaki ekleme ve değiştirme özelliklerinden sonra kullanıcının yıkım alanı içinbu nesneyi kullanacağız.

Şimdi ana planı oluşturalım;

$.widget("ui.editable", {

 options: {},

 _create: function(){},

 destroy: function(){}
 }

Yukarıdaki 3 plan ile yeni fonksiyonlar oluşturarak 3 yeni argüman giriliyor.. Bu sayede kendinize özgü bir yapıda kullanıcılarınıza bir kontrol paneli yaratabiliyorsunuz.

Daha fazla örnek ve bilgi için download butonunu kullanarak demodaki kodları incleyebilirsiniz.

jQuery Hareket Eden Kutular + İçerik

jD — Mon, 28 Mar 2011 13:58:24 +0000

Uzun bir aradan sonra tekrar merhabalar.. Bugün sizlere jQuery Efekti kullanılarak yapılan Çok hoş bir efekte sahip hareket eden kutular ve içerik ekleme plugininden bahsedeceğim..

Bu pluginde sadece hareket eden kutular değil bir de web sayfası hediyesi bulunmaktadır..

Web sayfasını plugin için hazırladığımız demoyu inceledikten sonra beğenirseniz download butonunu kullanarak indirebilirsiniz.

Ayrıca aşağıdaki bilgileri de kullanarak değişimleriniz yapıp kendinize göre uyarlayabilirsiniz.

Sayfa içeriğinden bahsetmek gerekirse;

İlk olarak sayfanın Arkaplan resmini değiştirmek için;

Kod içeriğindeki default.jpg resmini değiştirerek gerçekeltirebilirsiniz.

Demoyu incelediyseniz solda menü bulacaksınız. Bu menü içeriğini değiştirmek için;


	Lack of Color



	About
	Work
	Media
	Contact

Kodları arasındaki About, Work vs isimlerini değiştirme imkanınız var. Ayrıca farkettiyseniz data-easing halinde bir megacoloumb oluşturulmuş. Burada data-speed fonksiyonunu istediğiniz numarayı girerek animasyon hızını js dosyasını değiştirmeden gerçektleştirebilirsiniz. 600 ve 1000 seçenekleri yer alan ayarları kendinize göre ayarlayın..


	...
	
		
		
		...
	
	...

Ve lsiteler halinde resimleri göreceksiniz. Bu resimleri de yukarıdaki kod yığınını bularak kafanıza göre değiştirin, ya da sadece resimleri isimleri aynı kalacak şekilde değiştirebilirsiniz.

Bu güzel ve ücretsiz plugini kullanmak için download butonuna tıklayabilirsiniz.

Ücretsiz Yararlı Mac Programı:Structurer

jD — Tue, 25 Jan 2011 19:50:45 +0000

Bu uygulama size hızla yeni projeleri için kalsör/dosya yapıları oluşturmanızı sağlar. Cesar Tessarin, şimdi şablon oluşturma desteği, hem de yeni oluşturulan dosyaları otomatik olarak özel içerik atama olarak sağlayan bir çok geliştirilmiş bir versiyonu ile geri döndü. Üstelik Herkese ücretsiz.

Youtube üzerinden demo versiyonu incelemek için aşağıdaki Demo butonunu kullanabilirsiniz.

Download Structurer

Oldukça basit fakat çok yararlı olan bu uygulama Mac kullanıcılarına çok yararlı olabilecek ayrıca tasarım olarak fantastik bir görünüme sahip. Mac kullanıcıları programı indirip kullandıktan sonra bize yorum olarak görüşlerini bildirirseler çok mutlu oluruz.

Büyüteçli Portfolyo Slider’i jQuery ile

jD — Sun, 23 Jan 2011 16:40:54 +0000

jQuery ile Slider yapıyoruz. Fakat bu portfolyo da büyüteç aracını da kullanacağız.

Büyüteç aslında jQuery den çook daha önce web sayfalarında yer edinmiş bir javascript kodlamasıyla oluşmuştu.

Fakat aslına bakılırsa pek te göz alıcı bir özellik olmamasına karşın bir de sayfa da düzeni bozma ve büyüteç iptalinde sorunlar olabiliyordu..

Taa ki jQuery sayesinde binlerce efekti birkça kodla yazana dek.

Şimdi aşağıdaki butonlarla portfolyo’yu indirip inceleyebilirsiniz.

Portfoy’un markup’unu inceleyelim;


	
		
			
				
					
						
					
				
				...
				...
			
		
		
		
		Hover to zoom, click to view
	
	
		Portfolio Item
		Some description

Bir kaç katman, bir wrapper ve ardından resim ve boş bağlantı içerikleri.. Ne kadar sade ve kolay görünüyor değil mi? Gelin bir de işin Js yönüne ve ondan önce CSS boyutlarını kavrayalım;

CSS

Wrapper ve item ögelerini geçerek direk konuya girmek istiyorum;

.thumb_wrapper a.prev,
.thumb_wrapper a.next{
	width:30px;
	height:30px;
	position:absolute;
	top:50%;
	margin-top:-15px;
	outline:none;
	cursor:pointer;
}

cursor: pointer bu alanda mouse ile resmin üzerine gelindiğinde Pointer denen taşıma aracı çıkmaktadır. Bu da kullanıcıya bunun büyüteç olduğunu hatırlatmaya yarayabilir. İşin güzel yanlarından biride büyüteç tam resmi değil, sadece küçük resimin neresinde duruyorsanız o kısmı büyütmeye yaramasıdır. Zaten tüm resmi büyütmesi de büyüteç olmasına değil thumb’un sadece portfoya bir hover efekti katmasından başka birşey olamazdı.

İçerik olarak Javascript tarafından giriyoruz;

$("#content .cloud-zoom").fancybox({
	'transitionIn'	:	'elastic',
	'transitionOut'	:	'none',
	'speedIn'		:	600,
	'speedOut'		:	200,
	'overlayShow'	:	true,
	'overlayColor'	:	'#000',
	'cyclic'		:	true,
	'easingIn'		:	'easeInOutExpo'
});

Hız giriş ve çıkışlar, yuvarlanmışş kenarlar, gölgelikler ve renkler.. Tamamen prüzsüz ve çok anlaşılır bir dil ile yazılmış.. Bunlar dururken bir de jQuery katmamak olmaz değil mi;

$thumb_list.each(function(){
	var $this_list	= $(this),
	total_w		= 0,
	loaded		= 0,
	//preload all the images first
	$images		= $this_list.find('img'),
	total_images= $images.length;
	$images.each(function(){
		var $img	= $(this);
		$('').load(function(){
			++loaded;
			if (loaded == total_images){
				$this_list.data('current',0).children().each(function(){
					total_w	+= $(this).width();
				});
				$this_list.css('width', total_w + 'px');

				//next / prev events

				$this_list.parent()
				.siblings('.next')
				.bind('click',function(e){
					var current = $this_list.data('current');
					if(current == $this_list.children().length -1) return false;
					var	next	= ++current,
					ml		= -next * $this_list.children(':first').width();

					$this_list.data('current',next)
					.stop()
					.animate({
						'marginLeft'	: ml + 'px'
					},400);
					e.preventDefault();
				})
				.end()
				.siblings('.prev')
				.bind('click',function(e){
					var current = $this_list.data('current');
					if(current == 0) return false;
					var	prev	= --current,
					ml		= -prev * $this_list.children(':first').width();

					$this_list.data('current',prev)
					.stop()
					.animate({
						'marginLeft'	: ml + 'px'
					},400);
					e.preventDefault();
				});
			}
		}).attr('src',$img.attr('src'));
	});
});

Sadece bu kadar kodla 3 ayrı fonksiyon nasıl çalışıyor diyebilirsiniz. Demo kaynağına ya da indirdiğiniz dosyadaki kaynağa bakarsanız jQuery için oluşturulmuş 3 ayrı plugini göreceksiniz.

Bunlar Fancybox, Easing ve jQuery dışında Clood zoom pluginleridir. bunların işlevlerini de daha önceki derslerimde anlatmıştım.

İyi çalışmalar dilerim.

Tatlı Önizlemeli Minyatür Galeri

jD — Sat, 22 Jan 2011 21:05:27 +0000

Bu Pluginde, normalde bildiğimiz resim galerilerini dışında bir de thumbnail olarak adlandırdığımız küçük resim için bir önizleme paneli yer almakta. Galerinin altında bulunan thumbnail resimlerin üzerine gelindiğinde önizleme resmi çıkabiliyor ve güzel bir görüntü yakalanmış oluyor.

İlk olarak;

Markupu incelmek gerekirse;

Bilinen Wrapper ve div katmanlarından ayrı bir durum söz konusu değil, önemli olan jQuery Galerinin oluşumudur. Yine de HTML kodlarını göstermek istiyorum;


	
		
		
	
	
	
	
	
	
		
			Image 1
		
		
			Image 2
		
		...

Burada Thumbnail resim için ayrı bir konteyner, galeri için ve önizleme için ayrı bir wrapper oluşturulmuş. Aslında bu katmanları siz de farklı bölgelerde farklı değerlerle kullanabilirsiniz.
Bunu yapmak için tabiki minimum derecede de olsa bir CSS bilgisine sahip olmanız gerekiyor.
Şimdi Style dosyasına bakalım;

Stil dosyasında pek fazla anlatılacak bir şey bulamıyorum, yukarıda bahsettiğim gibi verilen wrapper’lara değer atanmış ve konteynerlerin yükseklik, genişlik gibi değerlerine yer verilmiştir.

.ps_image_wrapper{
	width:680px;
	height:450px;
	overflow:hidden;
	position:relative;
	margin:0 auto;
	-moz-box-shadow:0px 0px 5px #999;
	-webkit-box-shadow:0px 0px 5px #999;
	box-shadow:0px 0px 5px #999;
}

Bu arada, webkit olayını da CSS derslerinde çözdüğümüzü düşünerekten es geçiyorum.

Son olarak Javascript kodlarına değinelim;

Js dosyasında verilen kodlarda bir takıp varyasyonların tanımlandığını görmekteyiz. Bu tanımlamalar jQuery efektlerinde hangi nesnenin neye göre efekt kazanmasını sağlamaya yarar. Yukarıdaki stil tarzları da yine aynı şekilde id class sekmantasyonuyla nesnelere hareket kazandırmamızı sağlayacak. Varyasyonlar;

var $ps_container		= $('#ps_container'),
	$ps_image_wrapper 	= $ps_container.find('.ps_image_wrapper'),
	$ps_next			= $ps_container.find('.ps_next'),
	$ps_prev			= $ps_container.find('.ps_prev'),
	$ps_nav				= $ps_container.find('.ps_nav'),
	$tooltip			= $ps_container.find('.ps_preview'),
	$ps_preview_wrapper = $tooltip.find('.ps_preview_wrapper'),
	$links				= $ps_nav.children('li').not($tooltip),
	total_images		= $links.length,
	currentHovered		= -1,
	current				= 0,
	$loader				= $('#loader');

Ve galeri için oluşturulacak scripti bir kenara atıp, jQuery kodlamasıyla nasıl nesnelleştirilebildiğini görmenizi istiyorum;

/*first preload images (thumbs and large images)*/
var loaded	= 0;
$links.each(function(i){
	var $link 	= $(this);
	$link.find('a').preload({
		onComplete	: function(){
			++loaded;
			if(loaded == total_images){
				//all images preloaded,
				//show ps_container and initialize events
				$loader.hide();
				$ps_container.show();
				//when mouse enters the the dots,
				//show the tooltip,
				//when mouse leaves hide the tooltip,
				//clicking on one will display the respective image
				$links.bind('mouseenter',showTooltip)
					  .bind('mouseleave',hideTooltip)
					  .bind('click',showImage);
				//navigate through the images
				$ps_next.bind('click',nextImage);
				$ps_prev.bind('click',prevImage);
			}
		}
	});
});

İyi çalışmalar dilerim..

Tayfun ÇAKIR jQuery Dersleri

jD — Tue, 14 Dec 2010 01:11:58 +0000

Tayfun ÇAKIR’ın Zingocan.com’da yayınladığı jQuery Video dersleri.

Download:

jQuery Video Dersleri İndir:

http://hotfile.com/dl/118407914/04f9508/jquery-dersleri.part1.rar.html

http://hotfile.com/dl/118407915/7af7619/jquery-dersleri.part2.rar.html

http://hotfile.com/dl/118412022/62c3f01/jquery-dersleri.part3.rar.html