.active is used dynamically to achieve navigation effects

This time I will bring you the navigation effect of using .active dynamically. What are the precautions for using .active dynamically to achieve navigation effect? ​​The following is a practical case. Let’s take a look.

Get the link to the page you open through jq window.location.pathname;

Add an ID to your li in HTML. The naming of the id is the same as the href in the URL link

Find the corresponding li through the jq include method and add the active class name to it

Then. . There's no after that. . .

jq code:

$(function() {
 varli = $(".title_ul").children("li");
 for(vari = 0; i <p style="text-align: left;">
HTML code: </p><pre class="brush:php;toolbar:false">
<p>
 </p>

 
• 页面1
 
• 页面2
 
• 页面3
 
• 页面4
 
• 页面5
 

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

jQuery makes mouse wheel operation picture zoom size

jQuery implements the back to top function

The above is the detailed content of .active is used dynamically to achieve navigation effects. For more information, please follow other related articles on the PHP Chinese website!