Just upgraded to 10.2, now the dropdown button on hover is a red x and the dropdown only stays visible for a second before disappearing. Setting the DropDownButtonHoverClass had no affect. It appears to be a .css issue. Created a new project with a dropdown and it behaved the same until I tried giving it a built in style. When it downloaded the default new ig_res, it worked better but looked terrible. What is the magic setting in the .css to fix this? I have already put spent too many hours on what should have been a few minute upgrade, Markup and .css below. Thanks.
<ig:WebDropDown ID="DDLAG2" runat="server" Width="200px" DropDownContainerWidth="200px"
DropDownAnimationDuration="100" DisplayMode="DropDownList" EnableDropDownAsChild
="False"
EnableRenderingAnchors
="False">
<ClientEvents Initialize="DropDownInit"
/>
<ClientEvents SelectionChanged="ddlAcctGrpChng2"
</ig:WebDropDown
>
/*
Main control CSS class*/.igdd_ClassicControl{ font-size:8pt;}
/* Main Control CSS class when it's disabled*/.igdd_ClassicControlDisabled{ background-color:#E8E8E8; border:solid 1px #E8E8E8; table-layout: fixed;}
/* Main control css class on hover*/.igdd_ClassicControlHover{ background-color:White; table-layout: fixed;}
*/.igdd_ClassicControlFocus{ background-color:White; border:solid 1px #898989; table-layout: fixed;}
.igdd_ClassicControlArea{ background-color:White; border:solid 1px #898989; table-layout: fixed;}
.igdd_ClassicValueDisplay{ background-color:Transparent; border-style:none; width: 100%;}
.igdd_ClassicValueDisplayHover{}
*/.igdd_ClassicValueDisplayFocus{}
.igdd_ClassicValueDisplayDisabled{}
.igdd_ClassicValueDisplayReadOnly{}
.igdd_ClassicDropDownList{ background-color:White; font-size:8pt; font-family: Verdana, Arial, Helvetica, sans-serif; margin:0px; padding:1px;}
.igdd_ClassicDropDownListHover{}
.igdd_ClassicDropDownListReadOnly{}
.igdd_ClassicDropDownListContainer{ background-color:White; border:solid 1px #BBBBBB; float: left;}
*/.igdd_ClassicDropDownListContainerHover{}
*/.igdd_ClassicDropDownButton{ width: 17px; z-index: 9999;}
*/.igdd_ClassicDropDownButtonHover{}
/*CSS class that controls the style of the LI items in the list*/.igdd_ClassicListItem{ font-size:8pt; font-family: Verdana; padding:3px 5px 3px 5px; list-style-type: none; width: auto; min-height: 15px; height: auto !important; cursor:pointer;}
*/.igdd_ClassicListItemActive{ background-color:#FFE7A2; border:solid 1px #FFBD69; list-style-type: none; color:#333333;}
*/.igdd_ClassicListItemHover{ background-color:#FFE59C; background-repeat:repeat-x; background-position:top ; background-image: url(images/igdd_listitemhover.png); border:solid 1px #C0A776; list-style-type: none;}
*/.igdd_ClassicListItemSelected{ background-color:#FFF5B8; border:solid 1px #FFFBDD; list-style-type: none; color:#333333;}
*/.igdd_ClassicListItemDisabled{ list-style-type: none; width: auto; cursor:default;}
/*Applied to the whole pager*/.igdd_ClassicPager{ background-color:Transparent; border-top:solid 1px #868686; vertical-align:middle;}
/*Loading message container*/.igdd_ClassicLoadingItemsMessage{ background-color:#616A76; font-weight:bold; font-size:8pt; font-family: Verdana, Arial, Helvetica, sans-serif; margin:1px 0px 0px 1px; padding:3px; color:White;}
/*Styles the current page link only*/.igdd_ClassicPageCurrent{ font-size:8pt; font-family: Verdana, Arial, Helvetica, sans-serif; margin-top:5px; margin-right:3px; float: left; cursor:pointer; color:#FFBD69; text-decoration:underline; vertical-align:middle;}
/*Styles all page links in general */.igdd_ClassicPageLink{ font-size:8pt; font-family: Verdana, Arial, Helvetica, sans-serif; margin-top:5px; margin-right:3px; float: left; cursor:pointer; color:#4C535C; vertical-align:middle;}
*pseudo class used so Value Display input does not have focusglow in some browsers like GoogleChrome or AppleSafari*/input focus{ outline: none;}
Hello Matt,
'igdd_DropDownButtonHover' is a new image included in 10.2 and the styles applied in your application are older. Please create a new project, drag 10.2 webDropdown on the page to get access to the new ig_res folder and replace this in your application.
Hope this helps. Please let me know if you have any questions.
Sincerely,Swetha
Thanks Swetha for the reply, I did find the igdd_DropDownButtonHover.png and igdd_DropDownButtonPressed.png when I ran my app under firebug but I can not just use the new styleset because there are hundreds of hours of work getting the look and behavior wanted that gets trashed. I am now in the painful processes of swapping out 1 class at a time to see what is making the dropdown close when the mouse enters. Any help would be appreciated.
Thanks again,Matt