Change link color of the current page with CSS

by

With jQuery you could use the .each function to iterate through the links with the following code:

$(document).ready(function() {
    $("[href]").each(function() {
        if (this.href == window.location.href) {
            $(this).addClass("active");
        }
    });
});

Depending on your page structure and used links, you may have to narrow down the selection of links like:

$("nav [href]").each ...

If you are using URL parameters, it may be necessary to strip these:

if (this.href.split("?")[0] == window.location.href.split("?")[0]) ...

This way you don’t have to edit each page.

More Related Contents:

  1. When we using alert vs popup div tag? [closed]
  2. 5 stars and the golden 5 stars are not together (When browsing with Internet explorer)
  3. How to make page loaders/animations/transitions
  4. Download the text over image using jquery
  5. How to autosize a textarea using Prototype?
  6. Can I force a link to open in a specific browser?
  7. Why write when the mime type is set by the server?
  8. How to make Internet Explorer emulate pointer-events:none?
  9. How to show popup message like in Stack Overflow
  10. Using jQuery how to get click coordinates on the target element
  11. Dropdown select with images
  12. flow 2 columns of text automatically with CSS
  13. CSS delivery optimization: How to defer css loading?
  14. Bootstrap v2 Dropdown Navigation not working on Mobile Browsers
  15. Scale element proportional to Background Cover with jQuery
  16. How to build simple tabs with jQuery?
  17. Bootstrap Dropdown with Hover
  18. Failed to load resource: the server responded with a status of 404 (Not Found)
  19. Add CSS to with JavaScript?
  20. Images not loading when relative path is used in React
  21. how to get the base url in javascript
  22. Resize external website content to fit iFrame width
  23. How to show hidden divs on mouseover?
  24. Auto Mobile Site Redirect
  25. Placeholder for contenteditable div
  26. Setting the height of a DIV dynamically
  27. assign color to mouse cursor using CSS
  28. Center an Image vertically and horizontally using CSS
  29. Change background on button click, using CSS only? [duplicate]
  30. Jquery/Javascript Opacity animation with scroll

Leave a Comment