ASP.NET C# C/C++ Genel HTML/CSS Java JS/Ajax PHP XML Forum

jQuery ile Rakam Sayımı Yapmak

jQuery ile Rakam Sayımı Yapmak

Merhaba arkadaşlar,

Bugünlü makalemde jQuery ile nasıl rakam sayımı yapabileceğimizi öğreneceğiz. Rakam sayımından kastımın ne olduğunu da hemen kısaca açıklayayım. Mesela geri sayım yapacağız. Başlangıç değerimiz 500 bitiş değerimiz 158. Sayfa açıldığında 500'den geriye sizin belirlediğiniz aralıklarla saymaya başlar. Aynı işlemi birkaç değişiklike 158'den 500'e kadar şeklinde de artacak şekilde uygulayabiliriz.

 

Öncelikle sayfamıza vazgeçilmez olan jquery kütüphanesi ekleyelim:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Şimdi öncelikle ilk yazağım kodda "0"dan başlayarak "500"e kadar saydıralım:

<script type="text/javascript">
    var maks = 500;// php ile yazdırın bu değeri
    $(function(){
     ileriSayim();
    });
    function ileriSayim() {
     var deger = parseInt($('#sayac').html());
     $('#sayac').text(deger+1);
    // Üst ve alt satırdaki +1'i arttırarak sayacın kaçarlı sayılacağını belirtiyoruz
     if (deger+1 != maks) {
      setTimeout('ileriSayim()',50);
     }
     if(deger<=maks){
       $('#sayac').text(maks);
    }
    </script>

    // Bu kısmı sayacın görünmesini istediğiniz yere yazın
    <div id="sayac">0</div>

Aynı şekilde bu sayaş kodun da bir kaç değişiklik yaparak 500'den 0'a doğru saydıralım:

<script type="text/javascript">
    var min
= 0;// php ile yazdırın bu değeri

    $(function(){
     geriSayim();
    });
    function geriSayim() {
     var deger = parseInt($('#sayac').html());
     $('#sayac').text(deger-1);
    // Üst ve alt satırdaki -1'i azaltarak sayacın kaçarlı sayılacağını belirtiyoruz
     if (deger-1 != min) {
      setTimeout('geriSayim()',50);
     }
     if(deger>=maks){
       $('#sayac').text(min);
    }
    </script>

    // Bu kısmı sayacın görünmesini istediğiniz yere yazın
    <div id="sayac">500</div>

Umarım faydalı ve anlaşılır bir çalışma olmuştur.




Flash ve Z-Index Problemi

Flash ve Z-Index Problemi

Bu problemi web sitesi olan bir çok kişi yaşamıştır. Özellikle sitesinde açılır menü kullanan kişiler hep menülerinin flash'ın altında kaldığından şikayet ederler. Bunun sebebi siz her ne kadar menünüzün z-index değerini en büyük yaptığınızı düşünseniz de flash dosyalarının z-index değeri sonsuza ayarlıdır. Bu nedenle de açılır menüleriniz flash'ın altında kalır.

.acilirmenu{

position: absolute;

top: 0;

left: 0;

z-index: 6000;

}

Bu şekilde bile hazırlasanız menülerinizi yani z-index değerini 6000 bile yapsanız flash'ın arkasında kalmaya devam edecektir. Bunun için yapmanız gereken tek işlem flash parametrelerinden wmode'u transparent veya opaque yapmanızdır.

<param name="wmode" value="transparent">

// Veya

<param name="wmode" value="opaque">

Günümüzde Flash  dosyalarının görüntülenmesi için en çok kullanılan kütüphane SWFObject'dir. Birde bunun için ne yapmanız gerektiğini gösterelim:

// Tabii ki bunları script tagları arasına yazıyoruz

var so = new SWFObject("images/news.swf", "news", "160", "60", "6", "#000000");

// Bu satırla wmode için opaque değerini atamış olduk

so.addParam("wmode", "opaque");

so.write("flashcontent");

Daha sonra flash içeriğin görünmesini istediğiniz yere şunu yazıyorsunuz

<div id="flashcontent"></div>

Kolay gelsin,





jQuery ile URL Parametre ve Değerlerini Çekin

jQuery ile URL Parametre ve Değerlerini Çekin

 

Bir çoğumuz bir proje üstünde çalışırken PHP ile oluşturulmuş linklerdeki parametre ve değerleri çekmek isteriz. Bunun için Roshambo'nun snipplr'da paylaştığı JavaScript kodu işimizi görecektir.

function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

Bu fonksiyon URL parametreleriyle değerlerini bir dizi halinde getirir. Örneğin aşağıki link için deneyelim:

http://www.example.com/?me=myValue&name2=SomeOtherValue

getUrlVars() çağırdığımızda aşağıdaki diziye ulaşırız::

{
    "me"    : "myValue",
    "name2" : "SomeOtherValue"
}

İlk parametredeki değeri almak için aşağıki gibi çalıştırın fonksiyonu:

var first = getUrlVars()["me"];

// İkinci parametreyi almak içinse
var second = getUrlVars()["name2"];

Bu kodların jQuery için yoğurulmuş son halide aşağıdaki gibidir:

$.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return $.getUrlVars()[name];
  }
});

Yukarıdaki kodu javascript dosyanıza eklerseniz URL parametre ve değerlerini aşağıdaki gibi alabilirsiniz:

// URL Parametrelerini alalım
var allVars = $.getUrlVars();

// URL Parametre değerlerini alalım
var byName = $.getUrlVar('name');

:: Bu fonksiyon ihtiyaçlarınızı karşıladı mı?



Dizideki İfadeleri For Döngüsü ile Toplama

Dizideki İfadeleri For Döngüsü ile Toplama

Merhaba,

Bu yazımda bir dizi içindeki bütün değerleri for döngüsü ile nasıl toplayacağımızı anlatacağım.. Basit bir örnekle açıklıyorum

 

Örnek

 

 

$dizi=array(10, 25, 36, 65, 9, 25); // Basit bir dizi oluşturduk..

$dizi_boyutu=count($dizi); // Dizinin kaç terimden oluştuğunu saydık..

 

// Şimdi for döngüsü ile bu ifadeleri toplayalım

$toplam=0;

for($i=0; $i<=$dizi_boyutu; $i++){

 $toplam+=$dizi[$i];

}


echo $toplam; // Dizinin içindeki ifadelerin toplamını gösterir...

 

?>

Umarım faydalı olur. Bu makalede bizim işimizi "+=" operatörü görmüş oldu..

 

Tekrar görüşmek üzere...

 

:: Sorularınızı forumda sormak ister misiniz?



CSS veya JS Dosyalarını Birleştirin

CSS veya JS Dosyalarını Birleştirin

Yönetilebilirliği kolay olsun diye Css veya JavaScript kodlarını çoğunlukla ayrı ayrı dosyalarda tutarız. Örneğin ben, formları biçimlendiren css kodları ile resetleme yapan css kodlarını aynı dosyada tutmayı tercih etmem. Bu şekilde hiyerarşik çalışmak işleri kolaylaştırıyor. Fakat bunun bir dezavantajı var ki dosyaları web sayfamıza bağladığımızda dosya sayısı kadar HTTP isteği yapılıyor. Ayrıca istemci tarafından yapılan her bir istekte, sunucu dosyaları yeniden yüklüyor (bunun için özel bir ayar yapmadıysak). Bu durumdan kurtulmak için herşeyi tek bir dosyada birleştirip, bu dosyayı da önbelleğe almak web sayfalarımızın hızını arttıracaktır.

 

İlk önce dosyaları tek bir dosyada birleştirelim

Yazmış olduğum CombileFiles sınıfı yardımıyla Css veya JavaScript dosyalarınız tek bir dosyada birleştirilir ve bazı sıkıştırma işlemleri uygulanır. Bu işlem hem dosya boyutunu çok aşağıya çeker hem de yalnızca 1 HTTP isteği yapılmasını sağlar. Ve ayrıca sizin belirlediğiniz yaşam süresi (lifetime) boyunca dosyaların içeriği sunucudan değil ziyaretçinin kullandığını web tarayıcısının önbelleğinden çağrılır.

Öncesi:

 

Sonrası:

Şimdi de sonuçlara gözatalım

Yukarıdaki örnekte, css dosyaları için eskiden 5 HTTP isteği yapılırken şimdi 2 tane yapıldığı görülmektedir. “index.css” dosyası hariç diğer css dosyaları her istekte sunucudan tekrar yüklenirken şimdi ise tarayıcı önbelleğinden çağrılmaktadır. E peki yaptığımız bu değişiklikler web sayfamız ne kazandırdı? İşte sonuç:

Öncesi:

 

Sonrası:

eburhan CombileFiles class

Siz de benim eburhan CombileFiles class isimli sınıfımı kullanarak çok kolay ve zahmetsiz bir şekilde css veya js dosyalarınız birleştirebilirsiniz. Sınıfı kullanmak gerçekten çok kolay. Alttaki kodları bir combine.css.php dosyasına yazıyorsunuz ve sıkıştırılacak dosyaların bulunduğu yere kaydediyorsunuz. (not: daha önceden bir “cache” klasörü oluşturmuş ve bunu yazılabilir yapmış olmalısınız)


require_once 'eb.combinefiles.php';

$conf = array
(
'fileList' => array(
'_reset.css',
'_iskelet.css',
'_ozeller.css'
),
'cacheDir' => './cache/',
'cacheExt' => '.css',
'lifeTime' => 864000,
'compress' => array('gzip', 'css'),
'mimeType' => 'text/css',
'encoding' => 'utf-8'
);

CombineFiles::getInstance()
->setConf($conf)
->combine();

?>

Daha sonra web sayfanızın etiketleri arasında bu dosyayı şöyle çağırmanız yeterli olacaktır:

 rel="stylesheet" type="text/css href="/css/combine.css.php />

Sonuç

Sınıfı eBurhan Araçları sayfasından indirebilirsiniz. İçerisinde bir örnek de mevcut.



PHP İpuçları

PHP İpuçları

Bu makaledeki verilerden yararlanarak PHP'nin yorumlanma hızını arttırmakla kalmayıp gereksiz kod kalabalığından da kurtulacaksınız.

 

$deger = $deger + 1;

Bu kod aşağıdakiyle aynı anlamdadır:

$deger ++;

Bu işlemi çıkarma içinde kullanabilirsiniz:

$deger --;

 

 

Aynı isimli değişkenleri birleştirmek:

$adim = 'Oral ÜNAL';

$adim = "$adim benim adım!"; // $adim = 'Oral ÜNAL benim adım!';

Yerine aşağıdaki gibi ikici defa yazdığımız değişkende "=" işaretinde önce nokta(.) koyarak bu değişkeni birleştirebiliriz:

$adim = 'Oral ÜNAL';

$adim .= " benim adım!"; // $adim = 'Oral ÜNAL benim adım!';

 

 

Tek tırnak kullanmak çift tırnak kullanmaktan iyidir çünkü daha hızlıdır.

$ad = "Ad Soyad";
if ($ad == "Ad Soyad") {
echo "Gerçekten ad soyadmış"; }

yerine aşağıdaki gibi kullanılırsa daha hızlı çalışır

$ad = 'Ad Soyad';
if ($ad == 'Ad Soyad') {
echo 'Gerçekten ad soyadmış'; }

 

 

Şimdi küçük bir püf noktaya değinelim:

echo '$ad, yardımsever birisidir.';
// Çıktısı: $ad, yardımsever birisidir.
echo "$ad, yardımsever birisidir.";
// Çıktısı: Oral ÜNAL yardımsever birisidir.

Farkettiğiniz gibi tek tırnak içinde ki yazılan değişken adları olduğu gibi yazdırılırken çift tırnak içinde yazılan değişkenler değişkenin değeri neyse onu yazdırdı. Tek tırnak kullanacaksanız aşağıdaki gibi kullanmalısınız:

echo $ad . 'yardımsever birisidir.';

 

 

Eğer if...else kontrollerinizde bir fonksiyon, değişken vb. kullanacaksınız { ... } işaretlerine gerek yoktur.

if($ad=="Oral ÜNAL") {

echo 'Adı: '.$ad;

} else{

echo 'Adı: '.$ad.' değilmiş';

}

Kontrolünde tek işlem kullanıldığı için aşağıdaki gibi de yazılabilirdi:

if($ad=="Oral ÜNAL") echo 'Adı: '.$ad;

else echo 'Adı: '.$ad.' değilmiş';

 

 

if kontrolünde boolean türündeki bir değişkeni kontrol edecekseniz "==" veya "!=" sembollerine ihtiyacınız yoktur.

if($birsifir==true) echo "Evet doğru";

elseif($birsifir!=true || $birsifir==false) echo "Hayır doğru değil";

$birsifir değişkenimiz boolean olduğu içinde aldığı değerler "1 veya 0" olabilir. Bu durumda da true ve false ifadelerine gerek kalmıyor. Aşağıdaki kodları inceleyelim:

if($birsifir) echo "Evet doğru";

elseif(!$birsifir) echo "Hayır doğru değil";

 

Bu kısayollar hem sunucunuzun yorumlama hızını arttırıp hemde sizi fazla kalabalıktan kurtarır. Umarım işinize yarar.











RSSTwitter

En son yazılanlardan ilk senin haberin olsun


Valid HTML 5 Valid CSS!

Güncel Programlama Makaleleri by TR Kodlama © 2009 is licensed under a Creative Commons Alıntı-TicariOlmayan 3.0 Unported License.