Bir ok kaldırmak için nasıl <select> Firefox etiketi
Hey, <select>
etiket CSS3 (ben, form elemanları için özel stiller genel olarak kötü bir fikir olduğunu biliyorum) kullanarak stil için çalışıyorum. Y (Chrome / Safari) ben arzu sonuç alıyorum, ama Firefox güzel (hatta IE ile rahatsız etmiyorum) oynamıyor. CSS3 appearance
özelliği kullanıyorum, ama nedense Firefox dışarı açılan simgesini kurtulamıyorum.
Burada ne yaptığımı bir örnek: http://jsbin.com/aniyu4/2/edit
#dropdown {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding: 2px 30px 2px 2px;
border: none;
background: transparent url("http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png")
no-repeat right center;
}
Gördüğünüz gibi, bir şey fantezi için çalışmıyorum. Ben sadece varsayılan stilleri kaldırmak ve kendi açılan okum eklemek istiyorum. Gibi, büyük Y, Firefox harika dedim. Görünüşe göre, -moz-appearance: none
doens't açılan maddeyi kurtulmak.
Herhangi bir fikir? Ve, hayır, javascript bir seçenek değil. Bir şey çok saçma javascript yürütmek istemiyorum.
CEVAP
Güncelleme:bu Firefox v35 giderilmiştir. Ayrıntılar için full gist bkz.
Sadece anladımnasıl Firefox seç Kaldır. Hile -prefix-appearance
, text-indent
text-overflow
bir karışımı kullanmaktır. Saf CSS ve ekstra biçimlendirme gerektirir.
select {
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
}
Windows 8, Ubuntu üzerinde test edilmiş ve en son Firefox sürümleri Mac.
Canlı örnek: http://jsfiddle.net/joaocunha/RUEbp/1/
Bu konuda daha fazla: https://gist.github.com/joaocunha/6273016
Nasıl Firefox'DÜĞMELERİ gibi bağl...
Nasıl bir JavaScript nesnesinin bir öz...
Nasıl stil için bir <select> sad...
Nasıl jQuery UI iletişim kutusunda Kap...
Nasıl Python dizin tarafından bir list...