Css Style active link

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Fary4u
    Contributor
    • Jul 2007
    • 273

    #1

    Css Style active link

    using asp while condition
    how can i write perticular link as a selected value ?

    Code:
    <a class="mainlevel" href="p.asp?strCat=<%= strcat%>">
    <%= strcat %></a>
    using CSS style sheet

    Code:
    A.mainlevel:link {
    DISPLAY: block
    }
    A.mainlevel:visited {
    DISPLAY: block; TEXT-DECORATION: none
    }
    A.mainlevel:active {
    BORDER-LEFT: 5px; 
    }
  • azrar
    New Member
    • Nov 2008
    • 11

    #2
    Assuming you are creating a menu with multiple links

    There are two ways you can do it.

    First way is completely ASP:
    Code:
    ' assuming you are already displaying the category based on a value in the querystring
    current_cat_id = request.QueryString("cat")
    
    DO WHILE NOT rsLinks.eof
      cat_id = rs("cat_id").value
      cat_title = rs("cat_title").value
      css_class = ""
      If Cstr(cat_id) = Cstr(current_cat_id) Then
        css_class = " active" 'note the space, it is needed to separate the two class names (mainlevel and active)
      End IF
      response.write "<a href='p.asp?cat=" & rs("cat").value & "' class='mainlevel" & css_class & "'>" & cat_title & "</a>"
      rs.movenext
    Loop
    Note that you would need to make an "active" class in your CSS file. Like this:

    a.active {border-left:5px solid #333;}


    The other way is clever combo of ASP and CSS, but has some drawbacks.

    Include the following CSS declaration in your ASP page:
    Code:
    a[href='<%=request.ServerVariables("SCRIPT_NAME")%>'] {border-left:5px solid #333;}
    This method only works if you are linking putting the full virtual path in your links (which is a good practice to do anyway). Meaning, if your links point to "/p.asp" instead of "p.asp". Also it will not work in IE 6.

    Comment

    Working...