[Bilgi] Jquery ve CSS , Jquery uygulamalarının çakışmasını engelleme

[Machine]

Jquery,ajax,mootools gibi javascript uygulamaları kullanılırken çakışma problemi hepimizin canını yakabilir.
Çözüm yazımızın devamında.

Evet arkadaşlar bzaen bir sayfada birden fazla jquery,ajax,mootools uygulaması kullanabilirsiniz.eğer bu kodları siz yazamıyorsanız hazır kullanacağınız örneklerde aynı değişken isimleri kullanıldığından bazı çakışmalar oluşabiliyor.Bunun çözümü için kodların başında ;

PHP Kod:

var $(herhangi bir değişken ismi) = jQuery.noConflict(); 


koduyla değişken tanımlamamız gerekiyor.Sadece bu kadar değil daha sonra kodların içerinde her $ fiadesinin yanına değişken ismimizi yazmamız gerekiyor.

Örnek Kullanım;

Kod:

<script type="text/javascript">
        var $y = jQuery.noConflict();
   $y(document).ready(
            function(){
                $y('#news').innerfade({
                    animationtype: 'slide',
                    speed: 1000,
                    timeout: 5000,
                    type: 'random',
                    containerheight: '20px'
                });
                

        
</script>

Bu örneğimizde ben y isimli bir değişken oluşturdum.Daha sonra tüm $ gördüğüm yerlere değişken ismimi ekledim.

Evet basit bir ders olabilir fakat çoğu webmasterın zorlandığı bir konuyla ilgili paylaşımda bulundum.Umarım işinize yarar.Hayırlı Günler..

Not: Arkadaşlar kodlamalarınızda en ice detaya kadar kontrol edin ben böle yapınca çakışmalar olmuyor,eğer sizde oluyorsa kodlarda biryerleri açık bırakıyor veya eksik kodluyorsunuz demektir bir kodda öreneğin

kodlarınızın ve komutlarınızın bittiğinde bunu koymazsanız ve yeni bir komut girerseniz çakışma yapar

Kod:

});

Her zaman bunu kodlarınızın sonuna koyunuz.
bunu koymazsanız tüm herşeyi baştan yapmak zorunda kalıyorsunuz..

[Mecruh]

Hocam peki bir sorum olacak, her jquery dosyası için $'den sonra ayrı isim vermek mi gerekir yoksa hepsine aynı mı yazmak gerekir..

[xpserkan]

Her jQuery kullanımı aynı değildir, farklı alanlar için kullanılan çeşit çeşit uygulamalar mevcut, örneğin ben üst paneldeki ''jQuery'' çakışmasını önlemek için şu şekilde uygladım..

Kod:

<script type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function(){
        jQuery('body').xpserkan();
    });
</script>

jQuery dosyasına bağlı ayrı olarak xpserkan adında js dosyasında komutlar mevcut bu sayede komutu çağırıp çakışmayı engelle diyorum..

panel.js dosyasından çektirdiğim kod yapısının bir kısmı..

Kod:

(function($){
    
    $.fn.xpserkan = function(options) {
          
        // Create Default Settings
        var options = $.extend({
        className : 'tetik',
        buttonName : 'manevra'
        }, options);

[Mecruh]

Pek birşey anlamadım serkan abi

[xpserkan]

Hocam arkadaşımızın vermiş olduğu kodlarıda kullanabilirsiniz + dilediğiniz sayıda çoğaltabilirsiniz.. Ben bile bazı şeyleri deneme yanılma yönetimi ile çözüyorum , js olayını tarif etmek benim için zor bir durum, ha tasarımı ben yapacak olsam oturup başında çözene kadar uğraşırım, isterse 1 ay sürsün.. (yaklaşık 3 ay bir tema ile uğraştığım günlerde oldu.)

[Machine]

(02.02.2012, Saat: 07:08)Mecruh Adlı Kullanıcıdan Alıntı: Hocam peki bir sorum olacak, her jquery dosyası için $'den sonra ayrı isim vermek mi gerekir yoksa hepsine aynı mı yazmak gerekir..

Hocam eğer komutlarınız aynı satırda ve aynı zaman diliminde olmasını istiyorsanız tabiki 'de aynı yazcaksınız.Eğer yeni bir komut başlatcaksanız aşağıdaki kodla başlatıp bir önceki verdiğiniz isimleri değiştirip kodluyacaksınız,eğer her komut için aynı ismi verirseniz çakışma tapar üste y dediyseniz bir sonraki komutta x diyeceksiniz.

Kod:

var $(herhangi bir değişken ismi) = jQuery.noConflict();

xpserkan hocamın dediği gibi ayrı komut dosyası oluşturup jQuery dosyasına çekebilirsiniz komutları...

$y yerine $.fn.komutdosyası adı jQuery.noConflict(); dediğinizde komutdosyası

yerine konum belirtiniz ve jQuery otomatik olarak komutu ordan çeker.Bu sadece jQuery için geçerlidir. jQuery + CSS varsa yukardaki örnek verdiğim gibi ayrı ayrı isim verceksiniz.

[Remzi0068]

En Basiti ve Kolay Cözüm Su Sekildedir

Kod:

// Cakisma Önle
jQuery.noConflict();

// Fonksiyonumuz
jQuery(document).ready(function($){
      
      // Bu Durumda jQuery'yi Su Sekilde Kullanacagiz
      $("body").prepend("Bu Yazi jQuery ile body Taginin Önüne Yazdirilmistir!");

});