dropdown menu met jQuery

xJessica · Bericht door **xJessica** » 14 mar 2016, 17:47

Heeft er iemand hier verstand van jQuery enzo? Want ik moet voor informatica een website maken en we moeten het helemaal schrijven met HTML en CSS en ik wil een dropdown menu creëren met javascript/jQuery, maar ik snap er echt helemaal niks meer van.

https://gyazo.com/7a80c238326b602d141b857cc945e36e

Ik heb dus een sidebalk ^^ en bij Geschiedenis en Meer wil ik, dat als je met je muis er over heen gaat de submenu's tevoorschijn komen (https://gyazo.com/446476a6f2455b370723260f0c5595c1 op zo'n manier).

Ik heb al verschillende dingen geprobeerd en opgezocht maar het wil me niet lukken. Iemand die kan helpen?

Bericht door **tarac** » 14 mar 2016, 18:23

$('#cssmenu > ul').prepend('<li class=\"mobile\"><a href=\"#\"><span>Menu <i>☰</i></span></a></li>');
$('#cssmenu > ul > li > a').click(function(e) {
$('#cssmenu li').removeClass('active');
$(this).closest('li').addClass('active');
var checkElement = $(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
$(this).closest('li').removeClass('active');
checkElement.slideUp('normal');
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#cssmenu ul ul:visible').slideUp('normal');
checkElement.slideDown('normal');
}
if( $(this).parent().hasClass('mobile') ) {
e.preventDefault();
$('#cssmenu').toggleClass('expand');
}
if($(this).closest('li').find('ul').children().length == 0) {
return true;
} else {
return false;
}
});

Bericht door **Sven** » 14 mar 2016, 18:26

Jess, moet je dit serieus kunnen? Is dat Java?

Bericht door **tarac** » 14 mar 2016, 18:29

Sven schreef:Jess, moet je dit serieus kunnen? Is dat Java?

Eenvoudige uitleg, zie http://callmenick.com/post/slide-down-m ... ry-and-css

xJessica · Bericht door **xJessica** » 14 mar 2016, 19:04

Sven schreef:Jess, moet je dit serieus kunnen? Is dat Java?

ik herken wel wat dingen ja Sven xD Alleen geen idee waar ik het moet plaatsen ed. HTML en CSS is best easy, af en toe wat puzzelen maar niet erg moeilijk om te begrijpen en toe te passen. Totdat je al dat gebeuren met jQuery enz krijgt xD

@tarac is dat wat ik in mn .js bestand plaats? En moet k niet verder ook wat met de html en css doen?

EDIT: k zal ook even bij die link kijken, had die nog niet gevonden (alles wat ik wel vond was ingewikkeld xD) Ben hier pas ruim een maand mee bezig ofzo dus ja, veel kennis heb ik niet.

EDIT2: Ik heb die link van Tarac nu gebruikt, en gewoon even in een test pagina alles gekopieerd, css bestand erbij gemaakt en gelinkt en ik heb een .js bestand gemaakt met de benodigde codes erin, maar waar moet ik mn script linken? Want vgm mij moet ie niet in de <head>

Bericht door **tarac** » 14 mar 2016, 20:39

Ga eens naar http://simsforum-uitwisseling.weebly.com/
Klik er met rechts op en kies Bron bekijken.
Menustructuur staat vanaf regel 112

dropdown menu met jQuery

dropdown menu met jQuery

Re: dropdown menu met jQuery

Re: dropdown menu met jQuery

Re: dropdown menu met jQuery

Re: dropdown menu met jQuery

Re: dropdown menu met jQuery