This is a migrated thread and some comments may be shown as answers.

Sliding zone slipping under pdf

4 Answers 70 Views

Splitter

This is a migrated thread and some comments may be shown as answers.

Tomasz M.Lipiński asked on 23 Mar 2010, 01:36 PM

Hi,
My splitter consists of two panes: left and right. The left one contains a RadSlidingZone->RadSlidingPane->RadPanelBar acting as a navigator and the right one shows the content according to the navigator.
When:
- the navigator is undocked
- the content contains an open pdf file (to be precise: contains a form (.aspx) containing an iframe containing this pdf)
hovering over the navigator slides it out - but under the pdf. The same is when I open, for example, an MS Word document.

It is also in the cases of Chrome and Safari. In the case of Firefox: the navigator also slides under the pdf but after a while jumps to the front: except the RadSlidingPane's title which remains under the pdf.

Can I do anything to make the navigator sliding over the open document?

Regards
Tomasz

4 Answers, 1 is accepted

Accepted

answered on 26 Mar 2010, 10:44 AM

Hi Tomasz M.Lipiński,
The behavior you describe is expected as the PDF is a heavy weight object. Please refer to our Control is shown behind a heavy-weight object (PDF, Flash, ActiveX, etc) knowledge base article for additional information.

Unfortunately, we have not yet implemented the Overlay property for the RadSlidingPane control. You can use the following code, however, to create the IFRAME element:

<head runat="server">

<title></title>

<style type="text/css">

html, body, form

{

height: 100%;

padding: 0px;

margin: 0px;

overflow: hidden;

}

.RadSplitter .rspSlideZone iframe

{

background-color:#fff;

}

</style>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<telerik:RadSplitter ID="splitter1" Width="100%" Height="100%" runat="server" LiveResize="true"

SplitBarsSize="10">

<telerik:RadPane ID="paneTop" runat="server" Width="22px" Scrolling="None">

<telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" SlideDuration="0">

<telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Sliding pane" OnClientExpanded="OnClientExpanded">

</telerik:RadSlidingPane>

</telerik:RadSlidingZone>

</telerik:RadPane>

<telerik:RadSplitBar ID="splitBar1" runat="server" />

<telerik:RadPane ID="paneBottom" runat="server" Width="100%" Height="100%" ContentUrl="AlbertEinstein.pdf">

</telerik:RadPane>

</telerik:RadSplitter>

<script type="text/javascript">

var firstShow = true;

function OnClientExpanded(sender, args)

{

if(firstShow)

{

firstShow = false;

var slidingPane = $find("<%= RadSlidingPane1.ClientID %>");

slidingPane._popupBehavior.set_overlay(true);

slidingPane._popupBehavior._createOverlay($telerik.getBounds(slidingPane.get_element()));

}

</script>

</form>

</body>

Please note that I have set SlideDuration=0 for the sliding zone, as the IFRAME is created/displayed after the sliding pane is expanded - it is not animated as the sliding pane.

Regards,
Tsvetie
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.