Skip to main content
Tweeted twitter.com/StackOverflowPT/status/1153273596921430016
adicionou 3 caracteres ao conteúdo
Fonte Link
Laércio Lopes
  • 4,4mil
  • 3
  • 29
  • 52

Tenho esse link que muda o mudamostra/esconde o menu do site, quero chamar a atenção dos usuários para ele mudando a cor da fonte, é possível fazer somente com CSS?

setInterval(function(){
  if ($('#toggleMenu').hasClass('colored')) {
    $('#toggleMenu').css('color','#FAFAFA');
    $('#toggleMenu').removeClass('colored');
  } else {
    $('#toggleMenu').css('color','#0069D9');
    $('#toggleMenu').addClass('colored');
  }
}, 2000);
header {
  background-color: grey;
  padding: 0 5%;
}

#toggleMenu {
  text-decoration: none;
  color: #FAFAFA;
  transition: color 2s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" rel="stylesheet"/>
<header>
<a id="toggleMenu" href="#" style="font-size: 2em"><i class="fas fa-bars"></i></a>
</header>

Tenho esse link que muda o muda o menu do site, quero chamar a atenção dos usuários para ele mudando a cor da fonte, é possível fazer somente com CSS?

setInterval(function(){
  if ($('#toggleMenu').hasClass('colored')) {
    $('#toggleMenu').css('color','#FAFAFA');
    $('#toggleMenu').removeClass('colored');
  } else {
    $('#toggleMenu').css('color','#0069D9');
    $('#toggleMenu').addClass('colored');
  }
}, 2000);
header {
  background-color: grey;
  padding: 0 5%;
}

#toggleMenu {
  text-decoration: none;
  color: #FAFAFA;
  transition: color 2s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" rel="stylesheet"/>
<header>
<a id="toggleMenu" href="#" style="font-size: 2em"><i class="fas fa-bars"></i></a>
</header>

Tenho esse link que mostra/esconde o menu do site, quero chamar a atenção dos usuários para ele mudando a cor da fonte, é possível fazer somente com CSS?

setInterval(function(){
  if ($('#toggleMenu').hasClass('colored')) {
    $('#toggleMenu').css('color','#FAFAFA');
    $('#toggleMenu').removeClass('colored');
  } else {
    $('#toggleMenu').css('color','#0069D9');
    $('#toggleMenu').addClass('colored');
  }
}, 2000);
header {
  background-color: grey;
  padding: 0 5%;
}

#toggleMenu {
  text-decoration: none;
  color: #FAFAFA;
  transition: color 2s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" rel="stylesheet"/>
<header>
<a id="toggleMenu" href="#" style="font-size: 2em"><i class="fas fa-bars"></i></a>
</header>

Fonte Link
Laércio Lopes
  • 4,4mil
  • 3
  • 29
  • 52

Ficar mudando a cor da fonte somente com CSS

Tenho esse link que muda o muda o menu do site, quero chamar a atenção dos usuários para ele mudando a cor da fonte, é possível fazer somente com CSS?

setInterval(function(){
  if ($('#toggleMenu').hasClass('colored')) {
    $('#toggleMenu').css('color','#FAFAFA');
    $('#toggleMenu').removeClass('colored');
  } else {
    $('#toggleMenu').css('color','#0069D9');
    $('#toggleMenu').addClass('colored');
  }
}, 2000);
header {
  background-color: grey;
  padding: 0 5%;
}

#toggleMenu {
  text-decoration: none;
  color: #FAFAFA;
  transition: color 2s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" rel="stylesheet"/>
<header>
<a id="toggleMenu" href="#" style="font-size: 2em"><i class="fas fa-bars"></i></a>
</header>