Skip to main content
adicionou 120 caracteres ao conteúdo
Fonte Link
Andrey Hartung
  • 1,8mil
  • 4
  • 19
  • 40
removeu 5 caracteres do conteúdo
Fonte Link
Andrey Hartung
  • 1,8mil
  • 4
  • 19
  • 40
$(document).ready(function() {
    /*configuração do menu*/
  var active1 = false;
  var active2 = false;
  var active3 = false;
  var active4 = false;

  /*varvar evento = 'ontouchstart' in window ? 'touchstart' : 'click';*/'click';
  $('.parent2').on('click'evento, function() {
    if (!active1) $(this).find('.test1').css({'transform': 'translate(0px,125px)'});
    else $(this).find('.test1').css({'transform': 'none'}); 
     if (!active2) $(this).find('.test2').css({'transform': 'translate(60px,105px)'});
    else $(this).find('.test2').css({'transform': 'none'});
      if (!active3) $(this).find('.test3').css({'transform': 'translate(105px,60px)'});
    else $(this).find('.test3').css({'transform': 'none'});
      if (!active4) $(this).find('.test4').css({'transform': 'translate(125px,0px)'});
    else $(this).find('.test4').css({'transform': 'none'});
    active1 = !active1;
    active2 = !active2;
    active3 = !active3;
    active4 = !active4;
    });
     /*Configuração da velocidade em que a tela se mexe*/
    $(".slideDown a").click(function(event){        
        event.preventDefault();
        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 800);
     });
});

E a versão demo desse menu é essa

o meu Site é esse aqui

$(document).ready(function() {
    /*configuração do menu*/
  var active1 = false;
  var active2 = false;
  var active3 = false;
  var active4 = false;

  /*var evento = 'ontouchstart' in window ? 'touchstart' : 'click';*/
  $('.parent2').on('click', function() {
    if (!active1) $(this).find('.test1').css({'transform': 'translate(0px,125px)'});
    else $(this).find('.test1').css({'transform': 'none'}); 
     if (!active2) $(this).find('.test2').css({'transform': 'translate(60px,105px)'});
    else $(this).find('.test2').css({'transform': 'none'});
      if (!active3) $(this).find('.test3').css({'transform': 'translate(105px,60px)'});
    else $(this).find('.test3').css({'transform': 'none'});
      if (!active4) $(this).find('.test4').css({'transform': 'translate(125px,0px)'});
    else $(this).find('.test4').css({'transform': 'none'});
    active1 = !active1;
    active2 = !active2;
    active3 = !active3;
    active4 = !active4;
    });
     /*Configuração da velocidade em que a tela se mexe*/
    $(".slideDown a").click(function(event){        
        event.preventDefault();
        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 800);
     });
});

E a versão demo desse menu é essa

$(document).ready(function() {
    /*configuração do menu*/
  var active1 = false;
  var active2 = false;
  var active3 = false;
  var active4 = false;

  var evento = 'ontouchstart' in window ? 'touchstart' : 'click';
  $('.parent2').on(evento, function() {
    if (!active1) $(this).find('.test1').css({'transform': 'translate(0px,125px)'});
    else $(this).find('.test1').css({'transform': 'none'}); 
     if (!active2) $(this).find('.test2').css({'transform': 'translate(60px,105px)'});
    else $(this).find('.test2').css({'transform': 'none'});
      if (!active3) $(this).find('.test3').css({'transform': 'translate(105px,60px)'});
    else $(this).find('.test3').css({'transform': 'none'});
      if (!active4) $(this).find('.test4').css({'transform': 'translate(125px,0px)'});
    else $(this).find('.test4').css({'transform': 'none'});
    active1 = !active1;
    active2 = !active2;
    active3 = !active3;
    active4 = !active4;
    });
     /*Configuração da velocidade em que a tela se mexe*/
    $(".slideDown a").click(function(event){        
        event.preventDefault();
        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 800);
     });
});

E a versão demo desse menu é essa

o meu Site é esse aqui

adicionou 20 caracteres ao conteúdo
Fonte Link
Andrey Hartung
  • 1,8mil
  • 4
  • 19
  • 40

o Site é esse aquio meu Site é esse aqui

HTML:HTML:

CSS:CSS:

JS:JS:

o Site é esse aqui

HTML:

CSS:

JS:

adicionou 54 caracteres ao conteúdo
Fonte Link
Andrey Hartung
  • 1,8mil
  • 4
  • 19
  • 40
Carregando
Fonte Link
Andrey Hartung
  • 1,8mil
  • 4
  • 19
  • 40
Carregando