Cihan Topcu » select box http://www.cihantopcu.com notlar Mon, 18 Jul 2011 00:16:10 +0000 en hourly 1 http://wordpress.org/?v=3.3 Mootools ile özel select box (fake combo) http://www.cihantopcu.com/mootools-ile-ozel-select-box-fake-combo.html http://www.cihantopcu.com/mootools-ile-ozel-select-box-fake-combo.html#comments Mon, 23 Mar 2009 14:57:51 +0000 Cihan Topcu http://www.cihantopcu.com/?p=26 Bildiğiniz gibi select box özel bir kontroldür ve görünümü çok fazla değiştirilemez. Örneğin “heigth” özelliği firefox da değişmesine rağmen ie de değişmez. Amacımız select box ların yerine tüm görsel özellikleriyle oynayabileceğimiz, sadece html kodlarından oluştuğu için tüm browser larda aynı sonucu veren sanal select box oluşturmaktır. Öyle bir select box ki js yi ve [...]]]> Bildiğiniz gibi select box özel bir kontroldür ve görünümü çok fazla değiştirilemez. Örneğin “heigth” özelliği firefox da değişmesine rağmen ie de değişmez. Amacımız select box ların yerine tüm görsel özellikleriyle oynayabileceğimiz, sadece html kodlarından oluştuğu için tüm browser larda aynı sonucu veren sanal select box oluşturmaktır. Öyle bir select box ki js yi ve css i sayfaya eklediğinizde tüm select box ları otomatik değiştiriyor. Yerleştirmek sizin yeteneğinize kalmış.

Çalışma şekli : Sayfanızda bulunan tüm select box ları tarıyor, “multiple” tag ı ekleyerek gizliyor. Bulunduğu konuma <div> ekliyor ve tıklandığında “multiple” hale getirdiğiniz gerçek select box unuzu gösteriyor. Böylece gerçek select box unuzdaki item larınızı seçiyorsunuz.

combo1

Çalışan örnek için : http://www.cihantopcu.com/samples/fakecombo/index.html

İndirmek için :  http://www.cihantopcu.com/samples/fakecombo/fakecombo.rar

Bu kontrol http://www.cult-f.net/2007/12/14/elselect/ adresindeki kontrol optimize edilerek yeniden yazılmıştır.

]]> http://www.cihantopcu.com/mootools-ile-ozel-select-box-fake-combo.html/feed 1