Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to use Jquery animate function with links that are styled in a class?
    primarykey
    data
    text
    <p>I'm looking for the correct syntax for make this work. The thing is so simple as select different colors for links (link, hover, visited and active) depending of the color theme of the webpage.</p> <p>Let's see:</p> <h2>CSS</h2> <pre><code>.DarkTheme a { color: #66cccc; } .DarkTheme a:visited { color: #66FF99; } .DarkTheme a:hover { color: #AAFFCC; } .DarkTheme a:active { color: #FFFFFF; } </code></pre> <hr> <p>JQUERY (I'm using JqueryColor too, cause I'm using color transitions, but this is only for clarify this issue isn't a problem):</p> <p>How would be correct syntax!!?</p> <pre><code>function ChangeLinkColors() { $("a.DarkTheme:link").animate({"color":"#00FF0F"}, 2000); $("a.DarkTheme:visited").animate({"color":"#0F00FF"}, 2000); $("a.DarkTheme:hover").animate({"color":"#F0FF0F"}, 2000); $("a.DarkTheme:active").animate({"color":"#00FFFF"}, 2000); } </code></pre> <p>This doesn't works.</p> <pre><code>function ChangeLinkColors() { $(".DarkTheme a:link").animate({"color":"#00FF0F"}, 2000); $(".DarkTheme a:visited").animate({"color":"#0F00FF"}, 2000); $(".DarkTheme a:hover").animate({"color":"#F0FF0F"}, 2000); $(".DarkTheme a:active").animate({"color":"#00FFFF"}, 2000); } </code></pre> <p>This doesn't works!.</p> <p>The same in this two from above, but without quotes on "color" word, neither works.</p> <pre><code>function ChangeLinkColors() { $("a:link", $(".DarkTheme")).animate({"color":"#0000FF"}, 2000); $("a:visited", $(".DarkTheme")).animate({"color":"#0F00FF"}, 2000); $("a:hover", $(".DarkTheme")).animate({"color":"#F0FF0F"}, 2000); $("a:active", $(".DarkTheme")).animate({"color":"#00FFFF"}, 2000); } </code></pre> <p>This is another way of "I'm not gonna work" method... with, or without quotes con color parameter...</p> <p><a href="http://api.jquery.com/animate/" rel="nofollow">Here</a> the documentation of Jquery animation:</p> <p>Some of this ways to do it "appears" to work, but not, only change the color completely (no difference between <code>link</code>, <code>visited</code>, <code>hover</code> or <code>active</code>).</p> <p>Anyone know how is the correct way?</p> <p>I'm out of ideas.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload