Chciałbym zmienić CSS dla wyboru osób w sieci (są one zbyt trudne do zobaczenia dla użytkowników). Co to jest prosty sposób, aby to zrobić?
Moje preferencje w technologie wykorzystywane (w kolejności malejącej):
CSS
JavaScript
jQuery
Inne
Jak ustawić CSS dla wyboru niepełnosprawnych?
głosy
6
7 odpowiedzi
głosy 3
3
Ive miał szczęście z kilku bibliotek JS do pracy. Przyznane moja wymogiem było stworzenie pola wyglądają bardzo różni się od standardowego pola wyboru. Poniższy biblioteka jest nawet 508 zgodny.
głosy 0
0
Zasadniczo trzeba dołączyć zdarzenie onclick na div, p lub jakiegokolwiek innego elementu używanego do siatki, a następnie przenieść zaznaczone wartości do ukrytego elementu związanego z tego pola w siatce. co jest bardzo trywialne, jeśli javascript jest używany - sprawdź jQuery dodać zdarzenie onclick na każdym elemencie. jeśli kliknięciu ustawić wartość = 1 dla ukrytego elementu.
głosy 8
8
Sugeruję zmianę koloru tła ( background-colorna formularzu / zestaw pól) i sprawdzić, czy można wymyślić lepszy kontrast. (? Nie można wybrać) Jeśli chcesz tylko zmienić kolor niepełnosprawnej wyboru można spróbować:
input[disabled] {
...
/* CSS here */
...
}
Ale jeśli są one wyłączone z tego powodu, że na pewno nie muszą być wyraźnie widoczne? Celem ich będącego nieaktywna-out jest, z pewnością, aby uniknąć mylenia aktywny / aktywny i nieaktywnych / wyłączone elementów formularza?
głosy 2
2
input:disabled {}działa na każdej przeglądarce z wyjątkiem-zgadliście-IE. Dla IE, chyba będziesz musiał użyć niektóre biblioteki JS.
głosy 4
4
Zachować pole włączone, ale następnie dodać onfocus=this.blur()do wyboru, więc nie można kliknąć.
Lub w przypadku korzystania z ASP.NET (jak mówisz w swoim komentarzu) zachować pole ustawione na włączone i dodać następujące zdarzenia Page.Load:
CheckBox1.Attributes.Add("onclick", "return false;");
głosy 0
0
Jeśli masz formularz z połączeniem aktywnym i nieaktywnym wyboru, mając pola wyboru niepełnosprawnych wyszarzanie uniknąć nieporozumień dla użytkownika. Jeżeli intencją jest, aby wyświetlić stronę widok tylko z wyboru (np. Aby wyświetlić opcje wybrany produkt na paragonie zakupu) następnie zastąpienie elementów wejściowych wyboru ze zdjęć może spowodować lepsze wyniki.
Zastąpić
<input type="checkbox" disabled>
<input type="checkbox" disabled checked>
z
<img src="unchecked.gif">
<img src="checked.gif">
głosy 0
0
Właściwie z nieco CSS3 można makiety bardzo uproszczone rozwiązanie. Zawsze będzie musiał rozważyć, jakiego rodzaju wsparcia chcesz zaoferować. Ale jeśli jesteś w porządku z jego pracy w nowoczesnych przeglądarkach, tylko dać mu szansę.
Oto HTML
<label>
<input type="checkbox" name="test" />
<span>I accept terms and cons</span><br><br>
<button>Great!</button>
</label>
Tutaj jest CSS
button { display: none}
:checked ~ button {
font-style: italic;
color: green;
display: inherit;
}
A oto DEMO http://jsfiddle.net/DyjmM/