Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS]Select Hover
jepek
post
Post #1





Grupa: Zarejestrowani
Postów: 55
Pomógł: 10
Dołączył: 12.08.2007

Ostrzeżenie: (0%)
-----


Witam,

jak dobrać się do tego ptaszka rozwijanego, aby mi się nie zmieniał gdy najadę na select? Poniżej stan bez najechania i po najechaniu. Chcę aby stan po najechaniu czy rozwinięciu był taki sam jak bez najechania.

(IMG:http://i47.tinypic.com/cj96a.jpg)
Go to the top of the page
+Quote Post
mls
post
Post #2





Grupa: Zarejestrowani
Postów: 677
Pomógł: 89
Dołączył: 31.08.2003
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Całe szczęście, nie ma takiej możliwości.
Go to the top of the page
+Quote Post
Puszy
post
Post #3





Grupa: Zarejestrowani
Postów: 279
Pomógł: 42
Dołączył: 10.10.2011

Ostrzeżenie: (0%)
-----


Na upartego możesz zamienić select na divy. Dużo zabawy i raczej mało pożyteczne .

  1. <script type="text/javascript">
  2.  
  3. function rozwin(){
  4. document.getElementById('list').setAttribute('style', '');
  5. }
  6.  
  7. function ustawWartosc(id){
  8. document.getElementById('wybrany').setAttribute('value', ''+id+'');
  9. }
  10.  
  11.  
  12.  
  13. #list{
  14. position: absolute;
  15. text-indent: 5px;
  16. border: 1px solid #000000;
  17. width: 130px;
  18. overflow: hidden;
  19. cursor: pointer;
  20. }
  21.  
  22.  
  23. ul{
  24. list-style-type: none;
  25. padding: 0px;
  26. margin: 0px;
  27. }
  28.  
  29. li:hover{
  30. background-color: #CCCCCC;
  31. }
  32.  
  33.  
  34. <div id="list" onClick="rozwin();" style="height: 20px;">
  35. <ul>
  36. <li id=""><strong>Wybierz miasto:</strong></li>
  37. <li id="1" onClick="ustawWartosc(1);">Wroclaw</li>
  38. <li id="2" onClick="ustawWartosc(2);">Kraków</li>
  39. <li id="3" onClick="ustawWartosc(3);">Warszawa</li>
  40. <li id="4" onClick="ustawWartosc(4);">Parzymiechy Dolne</li>
  41. </ul>
  42. </div>
  43.  
  44. <input type="hidden" id="wybrany" value="" />


pisane na szybko, dodaj zamykanie i wyświetlanie miasta które wybrałeś.

Ale dla mnie to bez sensu (IMG:style_emoticons/default/haha.gif)


Edit:

żeby nie przypadkowo nie zaznaczyć tekstu dorzuć do css:

  1. div{
  2. -webkit-touch-callout: none;
  3. -webkit-user-select: none;
  4. -khtml-user-select: none;
  5. -moz-user-select: none;
  6. -ms-user-select: none;
  7. user-select: none;
  8. }
  9.  


Ten post edytował Puszy 25.05.2012, 13:55:24
Go to the top of the page
+Quote Post
Spawnm
post
Post #4





Grupa: Moderatorzy
Postów: 4 069
Pomógł: 497
Dołączył: 11.05.2007
Skąd: Warszawa




Kiedyś był do tego w css scrollbar-*-* ale usunięto.


Ewentualnie jeśli nie wprowadzi to zamieszania to zamiast <select/> daj <datalist/>.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 23.08.2025 - 05:19