2

I've been looking for an answer for this for the last couple of days but cannot seem to find anything.

I have a css drop menu that needs to appear when a certain link is hovered over. Normal css properties are not working as the "parent" items are dynamically created while the links that populate the menu are statically created. This causes the menu to appear whenever you hover over any item in the navigation menu, instead of just the one item that it is supposed to appear for.

What I am looking for is a simple javascript solution that can grab the url of a hovered/mouseover item to conditionally display my menu when the correct item is hovered.

Any help/ideas/hints would be greatly appreciated

Here is my Source code:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="LeftNav.ascx.cs" Inherits="Siteworx.Web.layouts.sublayouts.global.LeftNav" %>
<div id="left_nav">
  <asp:Repeater runat="server" ID="SubSectionNav" OnItemDataBound="SubSectionNav_ItemDataBound">
    <HeaderTemplate>
      <ul>
    </HeaderTemplate>
    <FooterTemplate>
      </ul>
    </FooterTemplate>
    <ItemTemplate>
      <asp:Panel ID="Panel1" runat="server" visible='<%#(IsActive(Container.DataItem) == "active")%>'>
        <li class="active">
          <a href="<%# DataBinder.Eval(Container.DataItem, " url ")%>"><%# DataBinder.Eval(Container.DataItem, "title")%></a>
          <asp:Repeater runat="server" ID="SubSubSectionNav">
            <HeaderTemplate>
              <ul class="sub_nav" id="drop_down_nav">
            </HeaderTemplate>
            <FooterTemplate>
              </ul>
            </FooterTemplate>
            <ItemTemplate>
              <ul>
                <%#(IsActive(Container.DataItem)=="active" ) ? "<li class=\"active\ ">" : "<li>" %><a href="<%# DataBinder.Eval(Container.DataItem, " url ")%>"><%# DataBinder.Eval(Container.DataItem, "title")%></a>
                  <ItemTemplate>
                    <ul>
                      <li><a href="http://MyLink/1.aspx">1</a></li>
                      <li><a href="http://MyLink/2.aspx">2</a></li>
                      <li><a href="http://MyLink/3.aspx">3</a></li>
                      <li><a href="http://MyLink/4.aspx">4</a></li>
                      <li><a href="http://MyLink/5.aspx">5</a></li>
                      <li><a href="http://MyLink/6.aspx">6</a></li>
                      <li><a href="http://MyLink/7.aspx">7</a></li>
                      <li><a href="http://MyLink/8.aspx">8</a></li>
                      <li><a href="http://MyLink/9.aspx">9</a></li>
                      <li><a href="http://MyLink/10.aspx">10</a></li>
                      <li><a href="http://MyLink/11.aspx">11</a></li>
                      <li><a href="http://MyLink/12.aspx">12</a></li>
                      <li><a href="http://MyLink/13.aspx">13</a></li>
                    </ul>
                  </ItemTemplate>
                </li>
              </ul>
            </ItemTemplate>
          </asp:Repeater>
        </li>
      </asp:Panel>
      <asp:Panel ID="Panel2" runat="server" visible='<%#(IsActive(Container.DataItem) == "")%>'>
        <li><a href="<%# DataBinder.Eval(Container.DataItem, " url ")%>"><%# DataBinder.Eval(Container.DataItem, "title")%></a></li>
      </asp:Panel>
    </ItemTemplate>
  </asp:Repeater>
</div>

And my CSS:

#drop_down_nav ul ul {
    display: none;
}
#drop_down_nav ul li:hover > ul {
    display: block;
}
#drop_down_nav ul {
    background: #ffffff;
    background: linear-gradient(top, #ffffff 0%, #999999 100%);
    background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%, #999999 100%);
    /*box-shadow: 0px 0px 9px rgba(0,0,0,0.15);*/
    padding: 0 2px;
    border-radius: 10px;
    list-style: none;
    position: relative;
    display: inline-table;
}
/*
#drop_down-nav ul:after {
    content: ""; clear: both; display: block;
}
*/
 #drop_down_nav ul li {
    float: left;
}
#drop_down_nav ul li:hover {
    background: #F6EFE5;
    background: linear-gradient(top, #4f5964 0%, #F6EFE5 40%);
    background: -moz-linear-gradient(top, #4f5964 0%, #F6EFE5 40%);
    background: -webkit-linear-gradient(top, #4f5964 0%, #F6EFE5 40%);
}
#drop_down_nav ul li:hover a {
    color: #4D4D4D;
}
#drop_down_nav ul li a {
    display: block;
    padding: 25px 40px;
    color: #757575;
    text-decoration: none;
}
#drop_down_nav ul ul {
    background: #F6EFE5;
    border-radius: 1px;
    padding-top: 1em;
    position: absolute;
    top: 100%;
    border-top: 1px solid #D7D7D7;
    border-bottom: 1px solid #D7D7D7;
    border-left: 1px solid #D7D7D7;
    border-right: 1px solid #D7D7D7;
}
#drop_down_nav ul ul li {
    float: none;
    border-bottom: 1px solid #C6D3D9;
    position: relative;
}
#drop_down_nav ul ul li a {
    padding: 15px 40px;
    color: #fff;
}
#drop_down_nav ul ul li a:hover {
    background: #F6EFE5;
}

Once again, any help is greatly appreciated. Thank you.

HTML Output:

</div>

            <div id="main_content_0_left_nav_0_SubSectionNav_ctl06_Panel1">

                <li class="active"><a href="/Nav-Heading/Sub-Nav-Heading.aspx">SECTION HEADING</a>
                <ul class="sub_nav" id= "drop_down_nav">




                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>






                        <itemtemplate> 

                             <ul>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-1.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-2.aspx">Item 2</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-3.aspx">Item 3</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-4.aspx">Item 4</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-5.aspx">Item 5</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-6.aspx">Item 6</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-7.aspx">Item 7</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-8.aspx">Item 8</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-9.aspx">Item 9</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-10.aspx">Item 10</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-11.aspx">Item 11</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-12.aspx">Item 12</a> </li>
                                <li><a href="http://dev.**.org/Nav-Heading/Sub-Nav-Heading/Sub2-Nav-Heading/Item-13.aspx">Item 13</a> </li></ul>
                        </itemtemplate>


                    </li></ul>

                   </ul>

6
  • Can you provide the HTML output?
    – Giona
    Commented May 20, 2013 at 23:33
  • Hi Giona, I have edited the question to include HTML output now.
    – Jeff Beese
    Commented May 21, 2013 at 13:49
  • Ouch, your code has too many errors to work with...sorry maybe you should review it at first
    – Giona
    Commented May 21, 2013 at 14:17
  • Funny, I don't seem to have any errors on my end.
    – Jeff Beese
    Commented May 21, 2013 at 15:59
  • It does work without displaying any error, but there're a lot of unclosed tags, itemtemplate isn't a valid html element, etc. No errors are shown just because of browser's capacity to interpret even malformed markup...
    – Giona
    Commented May 21, 2013 at 16:58

2 Answers 2

1

jQuery is the solution!

$("a").hover(function(){
  // if the hovered anchors href is equal to some url
  // you can use <%= &> tags to refer to a server value
  if ($(this).attr("href") == '<%= some server value %>') {
    // do your stuff here

  }
});
1
  • Thank you for your answer Ted, I will try this either later today or tomorrow as I am currently finishing up on an unrelated project.
    – Jeff Beese
    Commented May 23, 2013 at 13:52
0

Provided html is not correct in structure, please check this.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.