(Onlar kullanıcılar için görmek çok zor) bir tablo içinde engelli işaret kutusu CSS değiştirmek istiyorum. Bunu yapmak için basit bir yolu nedir?
: Teknolojilerindeki Benim tercihi (azalan sırada) kullanılan
CSS
JavaScript
jQuery
Diğer
Nasıl engelli işaret kutusu CSS ayarlamak için?
oy
6
7 cevaplar
oy 3
3
Ive işi yapmak için birkaç JS kütüphaneleri ile iyi şanslar vardı. Verilen benim gereksinimi kutuları standart onay kutusunu çok farklı görünmesi için oldu. Aşağıdaki kütüphane bile 508 uyumludur.
oy 0
0
temel olarak, div, p, veya ızgara için kullanılan diğer elemana onclick olayı takmak ve daha sonra bir tablo içinde bu alanla ilgili gizli elemana kontrol değeri aktarmak gerekir. herhangi bir öğe üzerinde onclick olay eklemek için jquery kontrol - hangi JavaScript kullanılırsa, çok önemsiz olduğunu. tıklandığında ise gizli elemanı için değer = 1 olarak ayarlayın.
oy 8
8
Ben arka (rengini değiştirerek öneririm background-colorformu / fieldset ait), ve daha iyi bir kontrast ile gelip görmek. (? Olmayan seçilebilir) sadece engelli rengini değiştirmek istiyorsanız onay kutularını deneyebilirsiniz:
input[disabled] {
...
/* CSS here */
...
}
bir nedeni engelli iseniz Ama, mutlaka onlar belirgin görünür olması gerekmez? Onların varlık gri renkte-out için amaç etkin / devre dışı / etkin ve pasif durumdaki elemanları arasında karışıklığı önlemek için, mutlaka, nedir?
oy 2
2
input:disabled {}Eğer hariç-IE onu tahmin her tarayıcı için çalışır. IE için, ben bazı JS kitaplığını kullanmak gerekecek sanırım.
oy 4
4
Etkin onay kutusunu tutun, ama sonra eklemek onfocus=this.blur()tıklandığında edilemez yüzden onay kutusunu.
(Eğer yorumunuzda söylemek gibi) veya ASP.NET kullanarak eğer etkin olarak ayarlanmış onay kutusunu tutmak ve Page.Load olaya aşağıdakileri ekleyin:
CheckBox1.Attributes.Add("onclick", "return false;");
oy 0
0
Eğer özürlü onay kutularını dışarı soluk sahip etkin ve devre dışı onay kutularını bir karışımı ile bir form varsa kullanıcı için karışıklığı önler. niyet onay kutularıyla salt görüntüleme sayfayı görüntülemek için ise daha iyi sonuçlar hale getirebilir ardından görüntülerle onay kutusu giriş öğeleri yerine (ex. Ürün bir satın alma fişine belirlenen seçenekleri göstermek için).
değiştirmek
<input type="checkbox" disabled>
<input type="checkbox" disabled checked>
ile
<img src="unchecked.gif">
<img src="checked.gif">
oy 0
0
Aslında biraz CSS3 ile bir çok basit bir çözüm mock up yapabilirsiniz. Hep sunmak istiyoruz ne tür destek dikkate almak gerekir. Eğer modern tarayıcılarda çalışan ile gayet Ama eğer sadece bir gitmek vermek.
İşte HTML bulunuyor
<label>
<input type="checkbox" name="test" />
<span>I accept terms and cons</span><br><br>
<button>Great!</button>
</label>
İşte CSS
button { display: none}
:checked ~ button {
font-style: italic;
color: green;
display: inherit;
}
Ve burada DEMO var http://jsfiddle.net/DyjmM/