Change CSS with jQuery

Asked

Viewed 1,840 times

0

I’ve changed css with jQuery, but I’d like to test a feature, in onclick it add a css, but a field :before how could I do that?

Code working

$j("#nome-login-mobile").click(function(){
    if ($j('#options-menu').is(':visible')) {
        $j('#options-menu').hide();
        $j('.nome-login-mobile').removeClass('changed');
    } else {
        $j('.nome-login-mobile').toggleClass('changed');
        $j('#options-menu').show();
    }    
})
jquery css
  • 1

    Take a basic look here, https://stackoverflow.com/questions/5041494/selecting-and-manipulating-css-pseudo-elements-such-as-before-and-afterusin

2 answers

1


Use addClass, or toggleClass to take and to each click

$('div').on('click', function() {
    $(this).addClass('before');
});
div.before:before {
    content: "before adicionado ";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>adicionar before</div>

  • I did, but it only goes back to normal when I click 2x, as I could give a remove in my if?

  • I will update the question with the code.

  • post html too, I don’t understand what you want to do

  • 1

    Already got it, updated the question with the code working.

1

You can post an example of how you want?

I believe something like:

$(document).on('click', '#efeito', function(){ //Ação executada no evento de clique no elemento com ID = "efeito"
$('#teste').css("background-color", "yellow"); //Insere fundo amarelo no elemento com ID = "teste"
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="teste">xyz</div>
<a herf="#" id="efeito">Mudar Estilo</a>

  • It’s something like this, only I had doubts if I could change the :after and :before functions, the way I found it was to add a class with an after and another class with another after, and in onclick change the classes to have the change I’d like.

Browser other questions tagged jquery css

You are not signed in. Login or sign up in order to post.