• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Jak zrobić, aby menu zwijała się po 2s.

Hosting forpsi easy 1 pln
0 głosów
259 wizyt
pytanie zadane 1 lipca 2016 w JavaScript przez Paweł123 Nałogowiec (33,500 p.)

Cześć, zrobiłem stronę http://www.karczmapelnamicha.pl/ z użyciem RWD. 

Chciałbym, aby po kliknięciu np: "kontakt" manu zwijało się automatycznie. Męczę się już od ponad 2h i nadal nie wiem jak to zrobić :( 

Czy może ktoś mi pomóc w zrobieniu takiego czegoś. Proszę o jakieś przydatne linki i wskazówki.

KOD JS

<script>
    $('.handle').on('click', function(){
    
                    $('nav ul').toggleClass('showing');
                    
    });
    </script>

Z góry dziekuje za pomoc.

komentarz 1 lipca 2016 przez Pietrak Pasjonat (18,850 p.)
Po co Ci ten js do prostego menu? Można było to stworzyć w css i tylko efekt, jak ten co chcesz uzyskać w js. Osoby z wyłączony js nie mogą korzystać z menu.

4 odpowiedzi

0 głosów
odpowiedź 1 lipca 2016 przez MichuDev Pasjonat (20,300 p.)

1. Jakość kodu: Nie używaj onclick'a zamiast tego użyj addEventListener i removeEventListener.

2.odstęp czasowy robimy używając funkcji  setTimeout.

 

komentarz 1 lipca 2016 przez kubaapk Nałogowiec (44,270 p.)
przecież nie używa onclick
komentarz 1 lipca 2016 przez mitelak Pasjonat (23,330 p.)

Używa 

<ul> 
            <li><a href="javascript:void();" onclick="scroll_to('#przejsce1');">O nas</a></li>
            <li><a href="javascript:void();" onclick="scroll_to('#przejsce2');">Oferta</a></li>
            <li><a href="javascript:void();" onclick="scroll_to('#przejsce3');">Menu</a></li>
            <li><a href="javascript:void();" onclick="scroll_to('#przejsce4');">Kontakt</a></li>
            <li><a href="javascript:void();" onclick="scroll_to('#przejsce5');">Galeria</a></li>
</ul>

 

komentarz 1 lipca 2016 przez kubaapk Nałogowiec (44,270 p.)
@up zwracam honor, nie zaglądałem w kod strony
0 głosów
odpowiedź 1 lipca 2016 przez RegularLemon Stary wyjadacz (12,260 p.)

Dodaj tylko setTimeout, żeby uzyskać opóźnienie.

<script>
  $('.handle').on('click', function(){
    setTimeout(function(){
     $('nav ul').toggleClass('showing');   
    }, 2000);                  
  });
</script>

 

0 głosów
odpowiedź 1 lipca 2016 przez mitelak Pasjonat (23,330 p.)
  • Przerób sobie po pierwsze te id przejscie1, przejscie2 na odpowiadające faktycznym nazwom czyli onas, oferta, menu itd :)
  • Następnie linkuj do nich przez <a href="#id">Nazwa</a> a nie dziwne konstrukcje z javascriptem, które bez javascriptu nie zadziałają (a href="#id" owszem)
  • Zwijanie możesz zrobić po prostu usuwając klase showing po kliknięciu w hiperłącze :)
0 głosów
odpowiedź 1 lipca 2016 przez Kamil Czech Dyskutant (7,700 p.)
Czemu nie używasz HTACCES
komentarz 1 lipca 2016 przez Paweł123 Nałogowiec (33,500 p.)

Ponieważ nie wiem jak to zrobić :( 

Dodałem coś takiego do pliku .htaccess i nadal nie działa. Może wiesz w czym może być problem? 

 

RewriteEngine on

RewriteRule catering-zielona-gora  index.html
RewriteRule catering-zielona-gora-galeria  galeria.html

 

 

komentarz 1 lipca 2016 przez Kamil Czech Dyskutant (7,700 p.)

to jest przykładowy dokument htacces, ale musisz w html-u zrobić przekierowanie np.

zatrudnij-programiste-webowego zamiast index.html

rozumiesz?

 

### PROTECT FILES ###
<FilesMatch "\.(htaccess|htpasswd|ini|fla|psd|log|sh)$">
Order Allow,Deny
Deny from all
</FilesMatch>

RewriteEngine on
RewriteRule zatrudnij-programiste-webowego index.html
RewriteRule kim-jestem kimjestem.html
RewriteRule oferta-tworzenie-stron-www oferta.html
RewriteRule cv-programista-php-javascript cv.html
RewriteRule kontakt-programista-php kontakt.html

 

komentarz 1 lipca 2016 przez Paweł123 Nałogowiec (33,500 p.)
komentarz 1 lipca 2016 przez Kamil Czech Dyskutant (7,700 p.)
a w hiper łączach zmieniłeś z galeria.html na catering-zielona-gora-galeria  ?
komentarz 1 lipca 2016 przez Paweł123 Nałogowiec (33,500 p.)
Tak

Nadal nie działa.

Podobne pytania

+2 głosów
2 odpowiedzi 698 wizyt
pytanie zadane 22 lutego 2021 w HTML i CSS przez Adusiek Użytkownik (660 p.)
0 głosów
1 odpowiedź 251 wizyt
pytanie zadane 24 maja 2018 w JavaScript przez `Krzychuu Stary wyjadacz (13,940 p.)
+2 głosów
1 odpowiedź 850 wizyt
pytanie zadane 16 stycznia 2016 w JavaScript przez Jakub98 Nowicjusz (200 p.)

92,123 zapytań

140,784 odpowiedzi

317,796 komentarzy

61,445 pasjonatów

Advent of Code 2023

Top 15 użytkowników

  1. 1468p. - Łukasz Eckert
  2. 1444p. - Dawid128
  3. 1430p. - CC PL
  4. 1419p. - rafalszastok
  5. 1418p. - Marcin Putra
  6. 1373p. - Mikbac
  7. 1362p. - rucin93
  8. 1351p. - sefirek
  9. 1296p. - Adrian Wieprzkowicz
  10. 1260p. - TheLukaszNs
  11. 1144p. - Michal Drewniak
  12. 1109p. - adrian17
  13. 1078p. - Eryk Andrzejewski
  14. 1063p. - nidomika
  15. 1061p. - Anonim 3447134
Szczegóły i pełne wyniki

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Uwaga - w dniach od 02.12 do 08.12 trwają Mikołajki (książki drukowane mają rabat -35%, ebooki do -45%). Zaś dodatkowy, specjalny kod zniżkowy: HELMIKOLAJ-10 dla naszych Widzów zapewni Wam oszczędność -10zł dla zamówień powyżej 70zł! Warto korzystać!

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...