Hangisi daha hızlı? ($().data(xx) ve $.data(xx))

Bildiğiniz gibi data değerlerini almak için .data() metodunu kullanıyoruz. Ancak performans olarak değerlendirdiğimizde aslında $.data() fonksiyon metodunu kullanmak daha avantajlı.
Continue reading

“Yanarım” Karlos-Yaren

Ulan İstanbul dizisini vakit buldukça izliyorum, hoşuma gidiyor samimi sıcak farklı bir dizi :) Gerçi biraz daha kurgu olarak iyileşse güzel olur ama bakalım. Dün yeni bölümünü izlediğimde yaren ve karlos’un harika düetini dinledim ve bayıldım :) Dizi için karlos yazmış şarkıyı, dinlemeyenleriniz var ise vakit kaybetmeden hemen dinlesin :)

Ceyl’an Ertem – Düşmedim Daha

Başarılı bir Indie Rock solisti olan Ceylan Ertem’in bu coverına bayılıyorum :) Belki henüz dinlememiş olanlarınız vardır, hadi dinleyelim..

jQuery ile Basit Checkbox ve Radio Özelleştirmesi

Çok basit şekilde checkbox ve radio inputlarını özelleştirebilirsiniz. İlk olarak radio ve checkbox için html yapılarına göz atalım;

<label>
    <input type="radio" name="cinsiyet" checked />
    Kadın
</label>
<label>
    <input type="radio" name="cinsiyet" />
    Erkek
</label>

Bu radio inputu içindi. Gördüğünüz gibi label kullanıyoruz. Sebebi ise labele tıklandığında otomatik olarak radio butonunu kendisi seçeceği için jquery’de ekstra bir şey yapmamıza gerek kalmıyor. Aynı şekilde checkbox içinse yapı şöyle;

<label>
    <input type="checkbox" value="1" name="test" checked />
    Kullanım Koşulları'nı okudum, kabul ediyorum.
</label>

Continue reading

Hayatım Müzik Diyenlere – Müzik Bakkal

Öğrenciyim, memurum, doktorum, kuaförüm, muhasebeciyim, mühendisim ama hayatım müzik diyorsan sen de hemen www.muzikbakkal.com a gel. Müziksiz bir hayat hatadır.
Müzikbakkal sizi hatalarınızdan döndürür.
Eşine, dostuna, sevgiline hediye mi almak istiyorsun ? Kafan mı karışık, karar mı veremedin? MüzikBakkal’da aradığına uygun mutlaka bir şeyler bulunur. “Hayatım Müzik” kategorisine bir bak! Tüm müzikal hediyelikler orada.
Kendini ödüllendirmek mi istiyorsun ? Bak aşağıda neler var Continue reading

PHP mb_convert_case() Fonksiyonu

Genelde latin karakterleri büyük küçük yaparken sorunlar yaşıyoruz.
Yaşamamak için aslında php’de Multibyte fonksiyonlarını kullanmak gerekiyor.
Bu yüzden alternatif olarak mb_convert_case fonksiyonu kullanılabilir.

Fonksiyon 3 parametre alıyor.
Bunlar sırasıyla String > Mod > Karakter Seti

3 farklı mod var. Bunlar;
MB_CASE_UPPER = Tüm ifadeyi büyütür.
MB_CASE_LOWER = Tüm ifadeyi küçültür.
MB_CASE_TITLE = İfadede her kelimenin baş harfini büyütür.

Örnek kullanımları ise şöyle;

$string = "şeker şey seni gidi";
echo mb_convert_case($string, MB_CASE_UPPER, 'UTF-8'); // büyük yazar
echo "<hr />";
echo mb_convert_case($string, MB_CASE_TITLE , 'UTF-8'); // kelimenin baş harflerini büyük yazar..

Kaynak: http://php.net/manual/en/function.mb-convert-case.php

AngularJS Notlarım – 5

Biraz daha direktiflerden bahsetmek istiyorum.. ng-click, ng-model ve ng-repeat direktifleri ile devam edebiliriz yazımıza.
Continue reading

AngularJS Notlarım – 4

Bu yazımda sizlere $http servisinin kullanımını göstermek istiyorum.
AngularJS’de amaç JSON olarak datayı almak ve DOM’da neler olacağını belirlemektir.
Continue reading

AngularJS Direktiflerini Kullanarak Tab Örneği

AngularJ direktiflerini kullanarak hiç javascript kodu yazmadan tab örneği hazırladık.


Continue reading

AngularJS Notlarım – 3

Önceki konularda sizlere ng-app direktifini göstermiştim. Bu şekilde anonim bir kullanım oluyor. Burada biz kendi modülümüzü oluşturmalıyız.

Neden modül oluşturuyoruz?

Controller, servisler, filterler, direktifler ve diğer şeyler için modülü kullanıyoruz. Yani aslında modüle tanımlıyoruz bunları.
Continue reading

AngularJS Notlarım – 2

AngularJS

AngularJS’de MVC yapısı olduğunu söyledim mi bilmiyorum. Bunu en temelden öğrenmek gerekirse size ilk olarak bir controller’ın nasıl oluşturulacağını göstermek istiyorum.
Continue reading

AngularJS Notlarım – 1

AngularJS

AngularJS öğrenirken bazı notlar alıyorum. Bunu bloğumda da zaman zaman paylaşacağım.
İlk olarak EngılırCeyEs diye okunmasıyla başlayalım olaya :) Ve devam edelim..

AngularJS’i kullanmak için 2 şey gerekli.
1) angular.js dosyasını sayfaya dahil etmek
2) HTML’de ng-app direktifini angular kullanacağımız alan için belirlemek
- Bu arada ng Angular‘ın kısaltılmış halidir.
Continue reading

HTML contenteditable – Düzenlenebilir İçerik

Html’de bir etiketin değerini düzenlenebilir yapmak için contenteditable kullanılıyor.
Örnek vermek gerekirse;

<div id="test" contenteditable="true">buraya tıkla ve beni düzenle!</div>

Ya da diğer nesneler içinde kullanmak isterseniz contenteditable="true" demeniz yeterli.

jQuery’de Değişikliği Yakalamak

Düzenlenebilir içerik değiştirildiğinde bunu input eventı ile yakalayabiliyoruz.

$('#test').on('input', function(e){
   alert( $(this).text() );
});

kolay gelsin.

Mail Tasarımı Kodlarken Dikkat Edilmesi Gerekenler

Front-end‘ci arkadaşlarım eminim ki mail tasarımı kodlama işi alıyorlardır.
Ancak mail tasarımlarını dökerken dikkat etmemiz gereken bazı durumlar var, bunlardan biraz bahsetmek istiyorum.

Bütün mail tasarımlarının dökümünde tablo yapısı kullanılır, çünkü mail servisleri çok kısıtlı imkanlar veriyor bizlere.

Elbette başka elemanlarda kullanılabilir ancak taslağın tablo yapısı üzerine inşa edildiğini incelerseniz hepsinde görebilirsiniz.

Dolayısı ile normal bir web sitesi gibi döküm rahatlığı yoktur.
Continue reading

PHP ile Excel Dosyası Oluşturmak

Bunun için yazılmış bir çok sınıf bulunmakta, ancak sanırım en basiti şu abimizin yaptığı :)
https://github.com/oliverschwarz/php-excel

Kullanımına örnek verecek olursak.

<?php

// sınıf dosyası
require 'excel_xml.class.php';

$data = array(
    1 => array(
        'ad', 'soyad', 'yas'
    ),
    array(
        'Tayfun', 'Erbilen', 21
    ),
    array(
        'Murat', 'Miregil', 21
    )
);

$xls = new Excel_XML('UTF-8', false, 'My Test Sheet');
$xls->addArray($data);
$xls->generateXML('xls-dosyasi-adi');

?>

İşte bu kadar basit :) Daha önce hiç yapmamış ama şimdi lazım olmuş olanlar için çok kullanışlı basit bir örnektir.
Kolay gelsin.

jQuery .trigger() Metodu

Bir nesne için atadığımız olayın gerçekleşmesini sağlıyor. Örneğin yukarı çık örneğimiz olsun.

$('#up').on('click', function(e){
    $('html, body').animate({
        scrollTop: 0
    }, 1500);
    e.preventDefault();
});

Şimdi #up nesnesinin click eventını tıklamadan nasıl tetiklerim? Tabi ki trigger ile.. Yani;

$('#up').trigger('click');

dediğim zaman sanki #up nesnesine tıklanmış gibi yazdığım click eventım çalışacaktır.
Bunu özellikle slider’da çok kullanıyorum ben, sizinde işinize yarayacağına eminim :)

Daha geniş kullanımı için: http://api.jquery.com/trigger/

kolay gelsin :)

jQuery .not() Metodu

Hariç anlamına gelir. Mesela bir nesne seçtik ama atıyorum 2. indexli nesne hariç. Ya da atıyorum .active classı olan nesne hariç. Hariçler haricinde bize kalan nesnede işlem yapmamızı sağlıyor.
Mesela seçtiğimiz nesneler içinde active classı yoksa tıklama işlemi yaptıralım;

<ul>
    <li>test</li>
    <li>test2</li>
    <li class="active">test3</li>
    <li>test4</li>
</ul>
$('.menu li').not('.active').on('click', function(e){
    alert('ta da!');
});

Verdiğim örnekte 3. lide click işlemi olmayacaktır çünkü active sınıfına sahip ve benim istediğim olayım ona sahip olmayan nesnelerde çalışıyor not sayesinde.

jQuery .filter() Metodu

jQuery’de bulunan metodlar içinde en sevdiğimdir. Çünkü büyük ölçüde işimi kolaylaştırıyor.
Örneğin bir nesneyi değişkene aktardım.

var tab = $('.tab li');

Şimdi burada ilk elemanı seçip addClass metodunu uygulamam gerektiğinde bunu filter ile belirtiyorum.

tab.filter(':first').addClass('active');

Böylece değişkenin taşıdığı nesnelerde filtreleme işlemi yapıp ilk elemanı seçmemi sağlıyor.
Tabi sadece ilk eleman için değil :not(), :eq(), this vb. bir çok şey için geçerlidir. Örneğin küçük bir tab uygulaması yapacak olsaydık işimiz çok kısa olacaktı;

var tab = $('.tab li'),
content = $('.tab-content');

content.filter(':not(:first)').hide();
tab.filter(':first').addClass('active').end().on('click', function(e){
    tab.removeClass('active').filter(this).addClass('active');
    content.hide().filter(':eq(' + $(this).index() + ')').show();
    e.preventDefault();
});

Ya da örneğin daha farklı bir örnek verelim;

$('.item').filter(function(index){
    return $( this ).hasClass('boxed');
}).addClass('active');

http://api.jquery.com/filter/

İşte böyle, kolay gelsin :)

jQuery .end() Metodu

Sıkça kullandığım bir metoddur kendisi.
Yaptığı iş ise, ilk seçilen elemana geri dönmesi. Yani örnek vermek gerekirse;

$('.item').find('a').addClass('external-url').end().on('click', function(e){
   alert('test');
});

Burada item içerisinde a nesnelerini bulup sınıf atadık. Eğer end metodunu kullanmamış olsaydık click işlemi a nesneleri için geçerli olacaktı. Ancak end kullandığımız için tekrar başa sardık ve filtreleme işlemlerini önemsemeden eventımızı uyguladık.
http://api.jquery.com/end/

Kolay gelsin.

Php Array içinde Değer Değiştirme

Örneğin 2,22,222,2222 şeklinde bir string ifadeniz var. Ve siz 22 değerini 44 yapmak istiyorsunuz. Bunu nasıl yapacaksınız? Bu bir string unutmayın. Eğer düşünceniz şu ise;

$string = '2,22,222,2222';
echo str_replace('22', '44', $string);

Sizi tebrik ederim yanlış cevap. Gelelim doğrusuna, çok fazla istisnai durum olacağından bana kalırsa en mantıklısı dizi haline çevirip dizi elemanını replace etme olacaktır. Örneğin;

$string = '2,22,222,2222';
$string = explode(',', $string);
echo implode(',', array_replace($string, array_fill_keys(
    array_keys($string, 22),
    44
)));

Nerede lazım olacak ki demeyin, bana oldu ki paylaşıyorum :)

Bir tane daha alternatif olabilir;

$string = explode(',', '2,22,222,2222');
$replaced = array_search('22', $string);
$string[$replaced] = 44;