bildirgec.org

yapımı hakkında tüm yazılar

Yeni ve Türk Yapımı iPhone – iPod Touch Oyunu iArbede ( Türkçe )

TurEnt | 11 October 2010 16:05

Ülkemizde “üstüne gidilmeye” çalışılan bir başka sektör de Mobil oyun sektörü. Yurtdışına kıyasla pek az oyun geliştiricimiz olsada, iSlash gibi oyunların başarısını gözardı etmek mümkün değil. Fakat ingilizce olan bu iPhone oyunundan ziyade daha spesifik bir kitleyi hedef alan yeni ve kaliteli bir oyun daha var. iArbede

Bu yeni iPhone oyunu tamamen türkçe. Ayrıca eğlenceli grafiklerle oluşturuldu. Bir gemiyi kontrol ettiğiniz bu Türk yapımı iPhone oyununda her seviyede size verilen vakit boyunca hayatta kalmaya çalışıyorsunuz. Öldürdüğünüz her düşman ve tamamladığınız her seviye size para kazandırıyor. Ve “Lazer” “Büyük Lazer” “Kalkan” gibi değişik geliştirmeler kullanabiliyorsunuz

jQuery İle “Gizle/Göster” Sütun ve Tablo Yapımı

Metin METE | 12 February 2010 08:52

Bu yazımızda jQuery ile sitemizdeki sağ yada sol sütunu, tabloyu yada paneli nasıl gizle/göster yapabileceğimizle ilgili uygulama hazırladım. Çalışma mantığı, daha önce anlattığım (jQuery İle “Tab” Uygulaması Geliştirmek) yazısındaki uygulama ve çalışma mantığıyla neredeyse aynıdır. Tek farkı! Bu uygulamada animasyonun daha fazla olması. Çalışan örneği için BU bağlantıya bakabilirsiniz.

Şimdi öncelikle site içeriklerini Ana Tablo içine aldım;

1
2
3
 
<div class="ana-tablo">

...

</div>

Ana Tablo için eklediğim stil;

1
 
.ana-tablo { overflow:hidden; position:relative; padding-bottom:10px; }

Şimdide sırayla içerikleri doldurmaya başlıyorum. Öncelikle Gizle/Göster butonlarını ekledim;

1
2
 
<div class="gizle">»</div>

<div class="goster">«</div></code>

Gizle/Göster butonları için eklediğim stil;

1
 
.gizle, .goster { font-size:25px; position:absolute; top:0; right:10px; background:#000; color:#fff; padding:5px 5px 8px 5px; line-height:0.2em; cursor:pointer; overflow:hidden; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:5px; -webkit-border-radius:5px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

Tabii bu bölümde de atlamamak lazım! Kullanıcılarımıza sadece “Gizle” butonu gösterileceğinden, “Göster” butonunu stille ekstra olarak gizledim;

1
 
.goster { display:none; }

Ardından Sağ Sütunu ekledim;

1
2
3
4
 
<div class="sag-sutun">

<div>...</div>

<div>...</div>

</div>

Sağ Sütun için eklediğim stil;

1
2
 
.sag-sutun { width:220px; float:right; overflow:hidden; padding-right:10px; margin-right:40px; }

.sag-sutun div { width:200px; padding:10px; margin-bottom:10px; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:10px; -webkit-border-radius:10px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

ve son olarak da Sol Sütunu ekledim;

1
2
3
 
<div class="sol-sutun">

...

</div>

Sol Sütun için eklediğim stil;

1
 
.sol-sutun { margin-right:280px; padding:10px; background:#fefee0; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:10px; -webkit-border-radius:10px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

Sayfa için kullanacağımız XHTML kodları burada bitiyor. Buradan sonrasında jQuery ile yazacağımız fonksiyonlar çalışacak.

jQuery kodlarını vermeden önce hazırladığım fonksiyonların ne işe yaradığından bahsetmek istiyorum. Öncelikle ilk fonksiyonumuz, “Gizle” butonu tıklanınca “Sağ Sütun” ve “Gizle” buttonu kaybolacak, kaybolan sütun yerine “Sol Sütun“‘u genişletecek, genişleyecek ama bir yandan da sağdan “Göster” butonu kadar boşluk bırakacak. İkinci fonksiyonumuzda ise “Göster” butonu tıklanınca “Gizle” butonu kaybolacak, “Sol Sütun” belirttiğimiz ölçüde tekrar daraltılacak, “Sağ Sütun” ve “Gizle Butonu” gösterilecek, gösterilecek ama “Sağ Sütun“‘un sağına “Gizle” butonun sığıcağı kadar boşluk ekleyecek. Aman dikkat!!! Anlattıklarımdan kafanız karışmasın. Sadece anlattıklarımı hayal edip, “- tabi ya! böle yapınca bu olucak, şöle yapınca şu olucak.” gibisinden düşünebilirsiniz…

Neyse, yukarıda anlattıklarım hayal ürünü olmaktan çıkıp, kodsal olarak bu şekli alıyor;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
$(document).ready(function(){

	$(".gizle").click(function(){

		$(".gizle").animate({opacity:0}, 250).hide("slow");

		$(".goster").animate({opacity:1}, 250).show("normal");

		$(".sag-sutun").animate({marginRight:"-220px", opacity:0}, 250);

		$(".sol-sutun").animate({marginRight:"40px"}, 250);

	});

	$(".goster").click(function(){

		$(".gizle").animate({opacity:1}, 250).show("normal");

		$(".goster").animate({opacity:0}, 250).hide("slow");

		$(".sag-sutun").animate({marginRight:"30px", opacity:1}, 250 );

		$(".sol-sutun").animate({marginRight:"270px"}, 250);

	});

});

Herşeyi bu şekilde yaptıktan sonra, aşağıdaki gibi kodlara sahip olucaktınız;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jQuery İle "Gizle/Göster" Sütun ve Tablo Yapımı</title>

<script src="http://arsiv.pilli.com/jquery-1.4.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){

	$(".gizle").click(function(){

		$(".gizle").animate({opacity:0}, 250).hide("slow");

		$(".goster").animate({opacity:1}, 250).show("normal");

		$(".sag-sutun").animate({marginRight:"-220px", opacity:0}, 250);

		$(".sol-sutun").animate({marginRight:"40px"}, 250);

	});

	$(".goster").click(function(){

		$(".gizle").animate({opacity:1}, 250).show("normal");

		$(".goster").animate({opacity:0}, 250).hide("slow");

		$(".sag-sutun").animate({marginRight:"30px", opacity:1}, 250 );

		$(".sol-sutun").animate({marginRight:"270px"}, 250);

	});

});

</script>

<style type="text/css">

.ana-tablo { overflow:hidden; position:relative; padding-bottom:10px; }

.sag-sutun { width:220px; float:right; overflow:hidden; padding-right:10px; margin-right:30px; }

.sag-sutun div { width:200px; padding:10px; margin-bottom:10px; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:10px; -webkit-border-radius:10px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

.sol-sutun { margin-right:270px; padding:10px; background:#fefee0; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:10px; -webkit-border-radius:10px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

.gizle, .goster { font-size:25px; position:absolute; top:0; right:10px; background:#000; color:#fff; padding:5px 5px 8px 5px; line-height:0.2em; cursor:pointer; overflow:hidden; /*Buradan*/-moz-box-shadow:1px 1px 5px #e4e4e4; -moz-border-radius:5px; -webkit-border-radius:5px;/*Buraya CSS3! Her tarayıcıda çalışmaz!!!..*/ }

.goster { display:none; }

</style>

</head>

<body>

<div class="ana-tablo">

<div class="gizle">»</div>

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

<div class="sag-sutun">

<div>...</div>

<div>...</div>

</div>

<div class="sol-sutun">...</div>

</div>

</body>

</ html>

2 adet online wordpress tema yapım sitesi

emango34 | 06 March 2009 13:51

Templatr

Bu site sayesinde kendinize özgürce bir worpress teması hazırlayabilirsiniz.Daha sonrada bu temayı siteye üye olarak download edebirlirsiniz.
Templatr Tema Yapımı
Cssez

Bu tema hazırlama sitesi ilede son derece basit ve kolay temalar hazırlamanızın yanı sıra gerçekten kolay kullanılan arayüzü sayesinde kolayca sökebilirsiniz bu işi.
Cssez Tema Yapımı

Türk Yapımı Mesajlaşma Sistemi

BoZzoRe | 03 October 2008 12:29

Program piyasamıza hergeçen gün yeni programlar ekleniyor birde mesajlaşma programı varki hem türk yapımı hemde kaliteli şifreleme sistemi ile dikkat çekiyor , özellikler şirketler için daha ideal olan bu sistemi geliştirerek daha değişik ve özellikli hale getirmeye çalışılıyor..

En İyi Yanı İse Diğerleri gibi hacklenme yanı yok tamamen program ve hiç bir uzantısız programdan ID alıp defvam ediyosunuz premium versiyonu çok daha farklı olucak free sürmünüde yenilikler bekliyoruz..

ilk ön izlenimler. :

sizde destekleye bilirsiniz..

sitesi burada—>