Yes sorry forgot to do it in the first place. Here is what ive got:
This is the effect i want when the nodes are hovered over works fine when i turn the "EnableCliendScript" property to True, but then the collapse/expand does not work properly because its inside the update panel. When the "EnableCliendScript" property is false everything else works but not the hover over effect.
<!-- THIS IS THE TREEVIEW IN THE MASTER PAGE -->
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:TreeView CssClass="TreeMenu" ID="menu_user" runat="server" DataSourceID="SiteMapDataSource1"
MaxDataBindDepth="100" NodeIndent="0" BorderWidth="0px" CollapseImageUrl="~/Images/minus.gif"
NoExpandImageUrl="~/images/blank2.gif" OnTreeNodeDataBound="menu_user_TreeNodeDataBound"
ExpandImageUrl="~/Images/plus.gif" OnDataBound="menu_user_DataBound" OnTreeNodeCollapsed="menu_user_TreeNodeCollapsed"
OnTreeNodeExpanded="menu_user_TreeNodeExpanded" EnableClientScript="False">
<HoverNodeStyle Font-Underline="False" ForeColor="WhiteSmoke" Width="100%" CssClass="LeafNodeSelected" />
<SelectedNodeStyle Font-Underline="False" ForeColor="White" HorizontalPadding="0px"
VerticalPadding="0px" Width="100%" CssClass="LeafNodeSelected" />
<RootNodeStyle BackColor="#2D5C3D" BorderStyle="Solid" BorderWidth="0px" ForeColor="White"
Width="100%" Font-Bold="True" CssClass="RootNode" />
<NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" HorizontalPadding="0px"
NodeSpacing="0px" CssClass="Node" VerticalPadding="0px" Width="100%" ChildNodesPadding="0px" />
<LeafNodeStyle BackColor="#8BB093" BorderStyle="Solid" BorderWidth="0px" ChildNodesPadding="0px"
Font-Bold="True" ForeColor="#2D5C3D" NodeSpacing="0.01em" VerticalPadding="0px"
Width="100%" Font-Overline="False" HorizontalPadding="2px" CssClass="LeafNode" />
<ParentNodeStyle BackColor="#2D5C3D" BorderStyle="Solid" BorderWidth="0px" ForeColor="White"
Width="100%" Font-Bold="True" CssClass="LeafNodeParent" NodeSpacing="0px" VerticalPadding="0px" />
</asp:TreeView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="menu_user" EventName="TreeNodeCollapsed" />
<asp:AsyncPostBackTrigger ControlID="menu_user" EventName="TreeNodeExpanded" />
</Triggers>
</asp:UpdatePanel>
<!-- THIS IS THE CSS -->
tr.LeafNode
{
padding: -5px;
margin: -5px;
}
table.LeafNode
{
padding:-5px;
margin: -5px;
}
th.LeafNode
{
padding:-5px;
margin: -5px;
}
td.LeafNodeSelected
{
border-bottom : solid 1px #c8ddca ;
border-top : solid 1px #769c80 ;
border-left: solid 1px #769c80 ;
height:0;
}
td.RootNode
{
border-bottom : solid 1px #769c80 ;
border-top : solid 1px #c8ddca ;
border-right:solid 1px #769c80 ;
}
.navigation{
border: 0px solid black;
border-bottom-width: 0;
width: 200px;
margin-top:-20px;
height:100%;
}
.HomeNode {
display: none;
border-bottom : solid 1px #769c80 ;
border-top : solid 1px #c8ddca ;
border-right:solid 1px #769c80 ;
height:0;
margin-bottom:0;
margin-top:3px;
font-family: verdana;
padding-left:1.5px;
font-size: 11px;
text-decoration:none;
font-weight: bold;
color:White;
margin-left:1px;
}
.HomeNode:hover {
display: none;
border-bottom : solid 1px #c8ddca ;
border-top : solid 1px #769c80 ;
border-left: solid 1px #769c80 ;
height:0;
text-indent:20;
font-family: verdana;
padding-left:1.5px;
font-size: 11px;
text-decoration:none;
font-weight: bold;
color:White;
}
.TreeMenu
{
margin-top: 0px;
margin-bottom:-1px;
}
1: 2: 3: 4: 5: 6: 7: 8: 9: 10: 11: 12: 13: 14: 15: 16: 17: 18: 19: 20: 21: 22: 23: 24: 25: 26: 27: 28: 29: 30: 31: 32: 33: 34: 35: 36: 37: 38: 39: 40: 41: 42: 43: 44: 45: 46: 47: 48: 49: 50: 51: 52: 53: 54: 55: 56: 57: 58: 59: 60: 61: 62: 63: 64: 65: 66: 67: 68: 69: 70: 71: 72: 73: 74: 75: 76: 77: 78: 79: 80: 81: 82: 83: 84: 85: 86: 87: 88: 89: 90: 91: 92: 93: 94: 95: 96: 97: 98: 99: 100: 101: 102: 103: 104: 105: 106: 107: 108: 109: 110: 111: 112: 113: 114: 115: 116: 117:





by: selvolPosted on 2009-07-06 at 19:06:17ID: 24790957
Could you share the CSS code or the page with us? Either in the form of the URL or attach the css and HTML code?
Selvol