I currently have a rad splitter control with two items, a rad tree view on the left, and a flash visualization on the right.
When i click on the splitter bar and move it to the right over the flash visualization, the bar loses focus and I cannot move the splitter farther to the right, but once I move the mouse back to the left so it is no longer over the flash element, the bar regains focus and I can move it. If i click the bar, and move it below the flash element, I can expand the splitter bar to the right.
The problem occurs in Internet Explorer 8, in regular mode and all compatability modes, but it does not occur in firefox or chrome.
Sample code for this problem is below:
<telerik:RadSplitter runat="server" ID="RsSplitter" Width="100%" Height="100%"> |
<telerik:RadPane runat="server" ID="RpMenuPane" Width="20%" Scrolling="Y"> |
<div id="menu"> |
<telerik:RadPanelBar ID="RpbMenuPanelBar" runat="server" Width="100%"> |
<CollapseAnimation Type="InOutCubic" /> |
<Items> |
<telerik:RadPanelItem Text="Search" Expanded="false"> |
<Items> |
<telerik:RadPanelItem> |
<ItemTemplate> |
<input type="text" id="TxtSearchBox" value="Search for a node" onfocus="this.value='';" /> |
<input type="button" id="BtnSearch" value="Go" onclick="searchViz(this.value);"/> |
</ItemTemplate> |
</telerik:RadPanelItem> |
</Items> |
</telerik:RadPanelItem> |
<telerik:RadPanelItem Text="Architecture" Expanded="true"> |
<Items> |
<telerik:RadPanelItem> |
<ItemTemplate> |
<telerik:RadTreeView runat="server" ID="RtvArchTree" CheckBoxes="true" CheckChildNodes="true" |
TriStateCheckBoxes="true" OnClientNodeClicked="archTree_NodeClicked" OnClientNodeChecked="archTree_NodeChecked" |
OnClientNodeExpanded="archTree_NodeExpanded" OnClientNodeCollapsed="archTree_NodeCollapsed"> |
</telerik:RadTreeView> |
</ItemTemplate> |
</telerik:RadPanelItem> |
</Items> |
</telerik:RadPanelItem> |
<telerik:RadPanelItem Text="Networks" Expanded="true"> |
<Items> |
<telerik:RadPanelItem> |
<ItemTemplate> |
<telerik:RadTreeView runat="server" ID="RtvNetTree" CheckBoxes="true" CheckChildNodes="true" |
TriStateCheckBoxes="true" OnClientNodeClicked="netTree_NodeClicked" OnClientNodeChecked="netTree_NodeChecked" |
OnClientNodeExpanded="netTree_NodeExpanded" OnClientNodeCollapsed="netTree_NodeCollapsed"> |
<Nodes> |
<telerik:RadTreeNode runat="server" Text="All Networks" Value="All Networks" /> |
</Nodes> |
</telerik:RadTreeView> |
</ItemTemplate> |
</telerik:RadPanelItem> |
</Items> |
</telerik:RadPanelItem> |
<telerik:RadPanelItem Text="Tools" Expanded="false"> |
<Items> |
<telerik:RadPanelItem> |
<ItemTemplate> |
<div id="exportControls"> |
<div> |
Select PDF paper size:</div> |
<select id="ddlPaperSize"> |
<option value="letter" onclick="hideCustomFields();">Letter (8.5 x 11)</option> |
<option value="legal" onclick="hideCustomFields();">Legal (8.5 x 14)</option> |
<option value="ledger" onclick="hideCustomFields();">Ledger (17 x 11)</option> |
<option value="tabloid" onclick="hideCustomFields();">Tabloid (11 x 17)</option> |
<option value="custom" onclick="showCustomFields();">Custom ...</option> |
</select><br /> |
<input type="text" id="txtCustomWidth" value="Width (inches)"></input> |
<input type="text" id="txtCustomHeight" value="Height (inches)"></input> |
<input type="button" id="btnExportPdf" value="Export PDF" onclick="exportPdf();" /> |
<br /> |
<input type="button" value="Export to PNG" onclick="exportPng();" /> |
</div> |
</ItemTemplate> |
</telerik:RadPanelItem> |
</Items> |
</telerik:RadPanelItem> |
</Items> |
</telerik:RadPanelBar> |
</div> |
</telerik:RadPane> |
<telerik:RadSplitBar runat="server" ID="RsbSplitterBar" CollapseMode="Forward"> |
</telerik:RadSplitBar> |
<telerik:RadPane runat="server" ID="RpVizPane" Scrolling="Both"> |
<div id="flashContent" style="padding: 5px 5px 5px 5px;"> |
<p> |
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed. |
</p> |
<script type="text/javascript"> |
var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); |
document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" |
+ pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>"); |
</script> |
</div> |
<noscript> |
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="90%" |
id="HorseBlanket"> |
<param name="movie" value="HorseBlanket.swf" /> |
<param name="quality" value="high" /> |
<param name="bgcolor" value="#f2f1e8" /> |
<param name="allowScriptAccess" value="sameDomain" /> |
<param name="allowFullScreen" value="true" /> |
<!--[if !IE]>--> |
<object type="application/x-shockwave-flash" data="HorseBlanket.swf" width="100%" |
height="100%"> |
<param name="quality" value="high" /> |
<param name="bgcolor" value="#f2f1e8" /> |
<param name="allowScriptAccess" value="sameDomain" /> |
<param name="allowFullScreen" value="true" /> |
<!--<![endif]--> |
<!--[if gte IE 6]>--> |
<p> |
Either scripts and active content are not permitted to run or Adobe Flash Player |
version 10.0.0 or greater is not installed. |
</p> |
<!--<![endif]--> |
<a href="http://www.adobe.com/go/getflashplayer"> |
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" |
alt="Get Adobe Flash Player" /> |
</a> |
<!--[if !IE]>--> |
</object> |
<!--<![endif]--> |
</object> |
</noscript> |
</telerik:RadPane> |
</telerik:RadSplitter> |