CODEWITHSUNDEEP
csscolorshyperlinkanchor
vini
vini

Reputation: 21

How do I change the color of the div targeted as anchor?

Let me try to make myself clear: I have a menu that, when you click on a link, it jumps down to the content in that same page. In other words, it's just an link that anchors to the content. Could I possibly change the color of, let's say, the content's h1 tag after clicking on the link?

I also thought of a different way of solving, but I'm not quite sure: could I change the color of a H1 tag depending on its position as you scroll down a page?

Cheers!

Upvotes: 0

Views: 1634

Answers (3)

Jezen Thomas
Jezen Thomas

Reputation: 13800

The CSS3 :target pseudo-selector will do what you want, but if browser support is an issue, you could do something like this:

jQuery

$('nav li a').click(function (e) {
    var targ = $(this).attr('href');
    $('html, body').scrollTop($("'" + targ + "'").offset());
    $("'" + targ + "'").css('color','red');
    e.preventDefault();
});

HTML:

<nav>
    <ul>
        <li><a href="#someElement">Click here!</a></li>
    </ul>
</nav>

Upvotes: 0

Stephan Muller
Stephan Muller

Reputation: 27640

Yes, you can use the :target pseudo-selector in CSS.

http://jsfiddle.net/8rHvy/

See here for the current browser compatibility: http://www.quirksmode.org/css/contents.html

Upvotes: 0

RoToRa
RoToRa

Reputation: 38441

Simple:

h1:target {color: red;}

Upvotes: 2

Related Questions