Post
Ask Question

Apply active CSS on Menus on Master Pages

Introduction

 
Apply active CSS on menus on Master Pages from code behind without javascript.
 
In our web applications
 
We face problems when using a Master Page. How to set the class for the active tab?
 
Here we can set active class
  1. <ul>  
  2.     <li id="page1" runat="server" >  
  3.         <a href="studentHomePage.aspx"> Dashboard    </a>  
  4.     </li>  
  5.     <li id="page2"  runat="server">  
  6.         <a href="Mytest.aspx">   My Test</a>  
  7.     </li>  
  8.     <li id="page3"  runat="server">  
  9.         <a href="TestReport.aspx">Test Report</a>  
  10.     </li>  
  11.     <li id="page4"  runat="server">  
  12.         <a href="Subscription_New.aspx">Subscribe</a>  
  13.     </li>  
  14. </ul>    
Code Bheind
  1. page_load {  
  2.   String activepage= Request.RawUrl;if(activepage .Contains("studentHomePage.aspx")){page1.Attributes("class") = "active";  
  3. }  
  4. else if(activepageactivepage .Contains("Mytest.aspx")) {  
  5.   page2.Attributes("class") = "active";  
  6. }  
  7. else if( activepage.Contains("TestReport.aspx") ) {  
  8.   page3.Attributes("class") = "active";  
  9. }  
  10. else if( activepage.Contains("Subscription_New.aspx")) {  
  11.   page4.Attributes("class") = "active";  
  12. }}  
Screen Shots
 
Tab 1
 
screen shots
 
Tab 2
 
output
Next Recommended Reading Drop Down Menu using CSS