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

Pomoc przy wyświetlaniu mobilnego menu

VPS Starter Arubacloud
0 głosów
113 wizyt
pytanie zadane 17 kwietnia 2018 w HTML i CSS przez P0Y3B Nowicjusz (220 p.)
edycja 17 kwietnia 2018 przez P0Y3B
		<ul id="mobileNav">
			<li><a href="#"><i class="fa fa-newspaper-o"></i></a></li>
			<li><a href="#"><i class="fa fa-search"></i></a></li>
			<li><a href="#" id="navActive"><i class="fa fa-navicon"></i></a></li>
		</ul>

	<div id="elMobileDrawer" class="myBB_drawer ipsHide" style="z-index: 5300;display: block;" animating="false">
		<a href="#" class="myBB_drawer_close" data-action="close" style="display: block;"><span>×</span></a>
			<div class="myBB_drawer_menu">
				<div class="myBB_drawer_content">			
				<ul class="myBB_drawer_list">
					<li><a href="#">Bany</a></li>
					<li><a href="#">Leaderboard</a></li>
				</ul>
			</div>
		</div>
	</div>

Standardowo <div class="myBB_drawer"> jest ukryty, i w jaki najlepszy sposób nadać mu odpowiednie style po kliknięciu w ikonkę nawigacji tj. <li><a href="#" id="navActive"><i class="fa fa-navicon"></i></a></li>

 

Style które na pewno bd musiał użyć to display:block; z-index: xxxxx; jakaś propozycja ?

 

coś na takiej zasadzie, https://codepen.io/vperl/pen/NYmJaK?page=1& próbowałem to jakoś pogodzić ze sobą lecz nie udaje Mi się to zbytnio 

1 odpowiedź

0 głosów
odpowiedź 17 kwietnia 2018 przez pablop76 VIP (123,060 p.)

Style które na pewno bd musiał użyć to display:block;

Niekoniecznie. Użyj ujemnego  left lub right w zależności gdzie ustawisz menu(działa z pozycjonowaniem innym niż static). A potem przełączaj (np: jquery toggleClass) klasę, która będzie transformować(pokazywać i ukrywać) obiekt menu (transform: translateX() ).

transition doda animacje.

komentarz 17 kwietnia 2018 przez P0Y3B Nowicjusz (220 p.)
Czy mógł byś Mi napisać jakiś jq do tego ?
komentarz 17 kwietnia 2018 przez pablop76 VIP (123,060 p.)
W linku, który podałeś jest to co potrzebujesz. Jquery w oknie JS
komentarz 17 kwietnia 2018 przez P0Y3B Nowicjusz (220 p.)

To jest kod który zmienia położenie ikonki z lewej na prawą stronę

komentarz 17 kwietnia 2018 przez pablop76 VIP (123,060 p.)
Fakt. Samo menu jest bez js. Użyto input type:chacbox

Podobne pytania

0 głosów
1 odpowiedź 232 wizyt
pytanie zadane 2 stycznia 2018 w HTML i CSS przez Artek Stary wyjadacz (11,800 p.)
0 głosów
1 odpowiedź 556 wizyt
pytanie zadane 22 czerwca 2017 w HTML i CSS przez ethern Nowicjusz (150 p.)
+1 głos
1 odpowiedź 117 wizyt
pytanie zadane 19 czerwca 2016 w HTML i CSS przez PieroQQ Początkujący (420 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

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.

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!

...