RadSplitter Hover image issue.

[Robert Dennyson]

Hi

I'm using RadSplitter with radslidingpane.  I have the following issue with these controls. I have attached screen of my issue. Plz provide the solution.


Thanks in advance

[Dobromir]

Hi Robert,

RadSplitter does not offer the required functionality out of the box. However, you can achieve the required result by manually resizing the tab container and the sliding zone during the OnBeforeDock / OnBeforeUndock RadSlidingPane's client-side events, e.g.:

<telerik:RadSplitter ID="RadSplitter1" runat="server">
    <telerik:RadPane ID="RadPane1" runat="server" Width="22px">
        <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server">
            <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" OnClientBeforeDock="OnClientBeforeDock"
                OnClientBeforeUndock="OnClientBeforeUndock">
            </telerik:RadSlidingPane>
        </telerik:RadSlidingZone>
    </telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitBar1" runat="server">
    </telerik:RadSplitBar>
    <telerik:RadPane ID="RadPane2" runat="server">
    </telerik:RadPane>
</telerik:RadSplitter>
<script type="text/javascript">
    function OnClientBeforeDock(sender, eventArgs)
    {
        var slidingZone = $find('<%=RadSlidingZone1.ClientID %>'); //get reference to the sliding zone
        sender.getTabContainer().style.width = "0px";
        slidingZone.get_element().style.width = "0px";
    }
    function OnClientBeforeUndock(sender, eventArgs)
    {
        var slidingZone = $find('<%=RadSlidingZone1.ClientID %>'); //get reference to the sliding zone
        sender.getTabContainer().style.width = "22px";
        slidingZone.get_element().style.width = "22px";

        var parentPane = $find('<%=RadPane1.ClientID %>');
    }
</script>

All the best,
Dobromir
the Telerik team