JavaScript

Een handvol nuttige animaties voor de perfecte site. Laat uw website er nog beter uitzien met deze set van geweldige animaties. De JavaScript van Deesign per component wordt hier getoond.

Navigatie bar

De navigatiebar heeft deze absoluut nodig voor het dropdown menu en de animatie voor het mobiele X-icoontje. U kunt de animaties apart gebruiken.

function dropdown(id){
	$('#dropdown'+id+' > .dropdown-menu, #dropdown'+id+' > .navp >.rotate').toggleClass('block down');
	$('#dropdown'+id).toggleClass('active');
}

$('#nav-icon').click(function(){
	$('#nav-icon').toggleClass('open');
	$('.navitems').toggleClass('navitemsopen');
});
          

Terug naar boven knop

De animatie van de terug naar boven knop is noodzakelijk om deze knop te doen laten werken.
$(window).scroll(function() {
    if ($(this).scrollTop() >= 50) {        // Als de pagina naar beneden als het meer dan 50px is
        $('.return-to-top').fadeIn(200);    // Fade de pijl in
    } else {
        $('.return-to-top').fadeOut(200);   // Anders fade de pijl uit
    }
});
$('.return-to-top').click(function() {      // Wanneer de pijl geklikt is
    $('body,html').animate({
        scrollTop : 0                       // Scroll terug naar boven
    }, 500);
});

            

Alerts

De waarschuwingen animaties voor het wegklikken van de waarschuwing.
$(function(){
    $(".alert").delegate("a.close", "click", function(event) { //Klik functie
        event.preventDefault();
        $(this).closest(".alert").fadeOut(function(event){   // Alert gaat dicht
            $(this).remove();
        });
    });
});
            
www.000webhost.com