Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Wykonanie dopiero po kliknięciu
Forum PHP.pl > Forum > Przedszkole
Adis92
Mam pewien problem, otóż posiadam link z 2 zdjęciami i chce aby 2 zdjęcie pokazało się dopiero po kliknięciu a nie po najechaniu na nie myszką i po ponownym kliknięciu aby się zamykał.
to jest kod style.css
  1. .hoverbox
  2. {
  3. cursor: default;
  4. list-style: none;
  5. }
  6.  
  7. .hoverbox a
  8. {
  9. cursor: default;
  10. }
  11.  
  12. .hoverbox a .preview
  13. {
  14. display: none;
  15. }
  16.  
  17. .hoverbox a:hover .preview
  18. {
  19. display: block;
  20. position: absolute;
  21. top: -33px;
  22. left: -45px;
  23. z-index: 1;
  24. }
  25.  
  26. .hoverbox img
  27. {
  28. background: #fff;
  29. border-color: #aaa #ccc #ddd #bbb;
  30. border-style: solid;
  31. border-width: 1px;
  32. color: inherit;
  33. padding: 2px;
  34. vertical-align: top;
  35. width: 100px;
  36. height: 75px;
  37. }
  38.  
  39. .hoverbox li
  40. {
  41. background: #eee;
  42. border-color: #ddd #bbb #aaa #ccc;
  43. border-style: solid;
  44. border-width: 1px;
  45. color: inherit;
  46. display: inline;
  47. float: left;
  48. margin: 3px;
  49. padding: 5px;
  50. position: relative;
  51. }
  52.  
  53. .hoverbox .preview
  54. {
  55. border-color: #000;
  56. width: auto;
  57. height: auto;
  58. }

a tutaj plik wywołujący
  1. <li>
  2. <a href="#"><img src="img/Lista.png" alt="sender" /><img src="img/Lista.png" alt="Sender" class="preview" /></a>
  3. </li>
erix
W samym CSS tego raczej nie osiągniesz; możesz spróbować zmienić pseudoklasę z :hover na :focus.
piotrooo89
tylko przy :focus i IE może być problem. KLIK
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.