Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML]Odsyłacz do innej strony i innej karty
Forum PHP.pl > Forum > Przedszkole
senior.pol
Witam serdecznie
Napotkałem pewien problem.
Otóż na stronie głównej swojego serwisu zamieściłem ofertę ,w której zamieszczone są atrakcje. Cała oferta znajduje się na podstronie z kartami. Dla każdej atrakcji jest inna karta. I tu pojawia się ten problem. Po kliknięciu na stronie głównej w wybraną atrakcję ,chciałbym aby na podstronie z ofertą i kartami otworzyła się wybrana atrakcja z głównej strony. Teraz obojętnie jaką atrakcję wybiorę to wyświetla się pierwsza karta.
Strona: www.sternicy.com.pl .
  1. <!-- TABS -->
  2. <!-- the tabs -->
  3. <ul class="tabs">
  4. <li><a href="#"><span>Rejsy jachtem</span></a></li>
  5. <li><a href="#"><span>Rejsy łodzią motorową</span></a></li>
  6. <li><a href="#"><span>Nauki windsurfingu</span></a></li>
  7.  
  8. </ul>
  9.  
  10. <!-- tab "panes" -->
  11. <div class="panes">
  12.  
  13. <!-- tab 1 content -->
  14. <div class="oferta">
  15. <h1>Rejsy jachtem</h1>
  16. <p>
  17. <img alt="Rejsy jachtem" src="img/oferta/rejsy_jachtem.png" style="float: left ;margin-right: 25px">
  18. <span class="highlight">Oferta w trakcie przygotowania.</span>
  19. </p>
  20. </div>
  21. <!-- ENDS tab 1 content -->
  22.  
  23. <!-- tab 2 content -->
  24. <div class="oferta">
  25. <h1>Rejsy łodzią motorową</h1>
  26. <p>
  27. <img alt="Rejsy łodzią motorową" src="img/oferta/rejsy_lodzia_motorowa.png" style="float: left ;margin-right: 25px">
  28. <span class="highlight">Oferta w trakcie przygotowania.</span>
  29. </p>
  30. </div>
  31. <!-- ENDS tab 2 content -->
  32.  
  33. <!-- tab 3 content -->
  34. <div class="oferta">
  35. <h1>Nauki windsurfingu</h1>
  36. <p>
  37. <img alt="Nauki windsurfingu" src="img/oferta/nauki_windsurfingu.png" style="float: left ;margin-right: 25px">
  38. <span class="highlight">Oferta w trakcie przygotowania.</span>
  39. </p>
  40. </div>
  41. <!-- ENDS tab 3 content -->
  42.  
  43. </div>
  44. <!-- ENDS TABS -->



  1. .tabs {
  2. list-style:none;
  3. margin:0 !important;
  4. padding: 0px;
  5. height: 32px;
  6. background: url(../img/tabs-divider.png) no-repeat bottom center;
  7. }
  8.  
  9. body.home .tabs {
  10. padding: 0px 30px;
  11.  
  12. }
  13.  
  14.  
  15. ul.tabs li {
  16. display: block;
  17. float:left;
  18. text-indent:0;
  19. padding:0;
  20. margin: 0px 5px 0px 0px !important;
  21. list-style-image: none !important;
  22.  
  23. }
  24.  
  25.  
  26. ul.tabs a {
  27. display:block;
  28. font-size:12px;
  29. height: 30px;
  30. line-height:30px;
  31. text-align:center;
  32. text-decoration:none;
  33. padding: 0px 0px 0px 10px;
  34. position:relative;
  35. top:0px;
  36. background: url(../img/tabs.png) no-repeat;
  37. }
  38.  
  39. ul.tabs a span{
  40. display:block;
  41. height: 100%;
  42. padding-right: 10px;
  43. background: url(../img/tabs.png) no-repeat right -40px;
  44. }
  45.  
  46. #content ul.tabs a{
  47. color: #747474;
  48. }
  49.  
  50. ul.tabs a:active {
  51. outline:none;
  52. }
  53.  
  54.  
  55. #content ul.tabs a:hover {
  56. background-position: 0px -80px;
  57. }
  58.  
  59. #content ul.tabs a:hover span,
  60. #content ul.tabs a.current span{
  61. background-position: right -120px;
  62. }
  63.  
  64.  
  65. ul.tabs a.current,
  66. #content ul.tabs a.current:hover,
  67. ul.tabs li.current a {
  68. cursor:default !important;
  69. color:#2a2d30 !important;
  70. display: block;
  71. background-position: 0px -80px;
  72. }
  73.  
  74.  
  75.  
  76. .panes .pane {
  77. display:none;
  78. }
  79.  
  80. .panes>div {
  81. display: none;
  82. min-height: 200px;
  83.  
  84. }


Próbowałem z kotwicą ,ale zamierzonego efektu nie przyniosło.
Proszę o pomoc
Pozdrawiam
by_ikar
Cytat
Próbowałem z kotwicą ,ale zamierzonego efektu nie przyniosło.


JS samo z siebie nie domyśli się o co ci chodzi. Poczytaj o location.hash jak masz jakieś podstawowe pojęcie o jquery (widziałem w źródle dołączone), to zrobisz sobie to co ci potrzeba w 10minut.
senior.pol
Właśnie nie ogarniam jquery sad.gif Ktoś pomoże
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.