Özel radio ve checkbox Butonları Hazırlamak (css/jquery)

Çoğu zaman css’e döktüğümüz tasarımlarda özel radio ve checkbox butonları olmakta. Buda bizim işimizi zorlaştırmakta.. En azından bir çoğumuzun diyelim 🙂 Hal böyle olunca bu checkbox ve radio butonlarını nasıl özelleştirebiliriz, kendimize göre düzenleyebiliriz bunu sizlere göstermek istedim.. Yararlı olması dileğiyle..

Kaynak Dosyalar

İndirmek İçin Tıklayın

Düzeltme;

radio ve checkbox’ları bir arada kullanabilmek için label’lere class atamamız gerekiyor.. Label içinde checkbox varsa class’ı checkbox, radio ise class’ı radio yaptıktan sonra css dosyalarındaki kodlarıda buna göre düzenlerseniz sorun düzelecektir.. İndireceğiniz örnek dosyalarda ben bu işlemi yaptım, inceleyebilirsiniz.

Yayınlayan

Tayfun Erbilen

2009’dan beri web işleriyle uğraşan, aynı zamanda amatör müziklede ilgilenen sıradan birisi..

“Özel radio ve checkbox Butonları Hazırlamak (css/jquery)” üzerine 11 yorum

  1. güzel ders olmuş teşekkürler.

    fakat jquery seçicilerinde aynı katmandaki nesneleri seçerken parentle üste çıkıp tekrar children kullanarak aynı katmandaki farklı nesneyi seçmek yerine siblings kullanmak daha mantıklı gibi…

    $(this).parent().children("span") yerine
    $(this).siblings("span") gibi

  2. @Erhan ASLAN, bir elin nesi var, iki elin sesi var 🙂 Dediğiniz gibi daha kısa ve doğru bir kullanım olur.

  3. öncelikle çalışmalarında başarılarının devamını dilerim…

    sana zahmet eğer zamanın varsa yada olursa serialize() ve unserialize() fonksiyonlarını anlatabilirmisin… videolu biçimde…

    teşekkürler ederim ….

    çalışmalarında ve kişisel hayatında da mutluluklar dilerim…

  4. Tayfun, öncelikle gerçekten aradığım bir dersti teşekkürler ders için harikasın 😉 ikincisi de bir ara bunu dropdown list içinde yapabilirmisin ? bir diğer sorum prototürk'e ne oldu 😀

  5. tayfun, sitende ufak tefek yenilikler görüyorum.^^
    daha önceden twitter, fb den nasıl takipçi sayısının alındığının bir videosunu çekmiştin. youtube'dan nasıl çekildiğini de yakında çekersin ^^ bir diğer maruzatım, bu yeni video büyüt tuşu ile alakalı. videoyu sayfanın duvarlarına yapıştırıp büyütüyor sanırım, ama lakin nasıl tekrar küçültüyoruz videoyu. sayfayı tekrar yüklemeden çıkamıyorum o büyümüş halden. belki videoyu bir pop-up a gömersen yine sayfa duvarı büyüklüğünde, o zaman yanına küçült tuşu da koyabilirsin. 🙂

    bunlar nacizane söylemek istediklerim. kolay gelsin tayfun 🙂 başarılar ^^

  6. @qwerqwer, evet ya o küçültme olayını yapmaya üşendim ne yalan söyleyeyim, üşenmediğim bir gün tamamlayacağım değişiklikleri ^^ Youtube takipçi sayısı ve birtakım şeyleri çekmek içinde youtube api kullanılıyor aslında, bende çok ayrıntılı bilmiyorum ama belki bir süre sonra bildiklerimi anlayabilirim youtube api ile ilgili 🙂

  7. Merhabalar bu ders çok başarılı olmuş, yalnız textarea selectbox vb input type'leri için böyle custom dersler hazırlanırsa çok makbule geçer 🙂

  8. @Kenan Yıldız, textarea ve input için ekstra bir şeye gerek yoktur.. Select için birazcık var tabi 🙂 Onlar içinde bir video hazırlarım inşallah.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir