Skip to main content

Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #152974
    schart
    Participant

    So I need to be able to fade to another background color using jQuery. Let’s say from #6495CA to #CD3333 for example. Thanks.

    #152976
    Steven Morgan
    Participant

    Is this an on click event or anything? If so the basic idea is:

    $("#yourDiv").click(function() {
        $(this).toggleClass('clicked');
    });
    

    And in your CSS:

    #yourDiv {
       background-color: #6495CA;
    }
    .clicked {
         background-color: #CD3333;
    }
    

    So basically, your div will be whatever color it is supposed to be in your CSS. Then when it’s clicked, it will add the class ‘clicked’ which will override the original color with the new ‘clicked’ bg color.

    #152978
    Paulie_D
    Moderator

    You’d have to add a transition to get the fade. That’s not hard though.

    #152982
    Steven Morgan
    Participant

    You could do something like this:
    $(‘body’).animate({backgroundColor: ‘#CD3333’}, ‘slow’);

    #152984
    Paulie_D
    Moderator

    Is it that simple?

    It sure is

    http://codepen.io/anon/pen/LyiFg

    #152987
    Steven Morgan
    Participant

    ^perfect

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.