Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][CSS] jQuery chowająca się ramka
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
mtskilla
Witam

Mam pewien problem.

Mianowicie tworze sobie wysuwaną ramkę na podstawię artykułu:
http://websta.pl/tutoriale/jquery-wysuwany-boczny-panel-menu

Mój problem jest taki, ze chciałbym aby albo menu znikało po schowaniu albo chowało się za divem.
W tym artykule jest pokazane jak zrobic aby menu chowało się poza przeglądarką. a ja chciałbym zrobic tak aby chowało mi się np. za divem na środku strony.

przesuwałem ramke i ustawiałem ale nei moge jej przykryc divem. nawet jak stosowałem numeracje "z-index"..

czy wie ktos jak to zrobic?
czy moze jest jakis sposob aby po kliknieciu na "zamknij" div się "zsuwał" do zera, a nie przesuwał?

pozdrawiam
Blame
Z-index musi działać, jak nie to znaczy, że coś ci go nadpisuje albo ustawiłeś go tylko dla menu a zapomniałeś o tym div'ie. Ale mogę tylko zgadywać, prosim o przykład na żywo z tym co chcesz osiągnąć smile.gif
mtskilla
https://m4tysi4k.nazwa.pl/projekt/em/


  1. #content {
  2. background: red;
  3. width: 618px;
  4. float: right;
  5. min-height: 400px;
  6. z-index: 2;
  7. }
  8.  
  9. #panel{
  10. background: #223344;
  11. padding: 10px;
  12. width: 200px;
  13. position: relative;
  14. margin-top: 0px; /*połowa wysokości panelu w górę */
  15. z-index: 1;
  16. top: 50%;
  17. }



content to ten div na czerwono, a panel to "pływająca ramka"
chce zeby się ona chowała pod tym divem ale nie moge jej tam wcisnąc...


skrypt js

  1. <script type="text/javascript">
  2. $(function(){
  3.  
  4. $("#panel").css("left","380px");
  5.  
  6. $(".slide_button").toggle(function(){
  7.  
  8. $("#panel").animate({left: "600px"}, 500 );
  9. $(this).addClass("zamknij");
  10. return false;
  11. },
  12. function(){
  13. $("#panel").animate({left: "380px"}, 500 );
  14. $(this).removeClass("zamknij");
  15. return false;
  16. });
  17.  
  18. });
  19. </script>


budowa strony:
  1. <div id="content">
  2. <div id="panel">
  3. <ul id="main_menu">
  4. <li><a href="#">Strona główna</a></li>
  5. <li><a href="#">Portfolio</a></li>
  6. <li><a href="#">Kontakt</a></li>
  7. </ul>
  8. <a href="#" class="slide_button" >Menu</a>
  9. </div>
  10. </div>



bede wdzieczny za jakiekolwiek sugestie..
z js jestem baaaardzo zielony..
Blame
Wydaje mi się, że problem polega na tym, iż to menu nie może być w div'ie za którym się ma schować. Musisz je dać osobno i potem wypoycjonować.
mtskilla
Niestety to nic nie daje..

Próbowałem już na wszystkie sposoby..

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.