Here is a sample code page and screenshot (IE9 on Win7) (attached)
I have deliberately made the actual control border red solid to show the issue.
=======================================================================
<%@ Page Language="VB" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="SM1"></asp:ScriptManager>
<telerik:radrotator id="RadRotator1" runat="server" datasourceid="XmlDataSourceSubsKeyInfo"
frameduration="8000" rotatortype="AutomaticAdvance" scrolldirection="Up" height="190px"
width="178px" backcolor="#eeeeff" BorderStyle="Solid" BorderColor="#ff0000">
<ItemTemplate>
<div style="width: 166px; height: 178px; padding: 0 6px;"><br /><br />
<%# XPath("product") %>
</div>
</ItemTemplate>
</telerik:radrotator>
<asp:XmlDataSource ID="XmlDataSourceSubsKeyInfo" runat="server" DataFile="~/xml/test.xml">
</asp:XmlDataSource>
</form>
</body>
</html>
==========================================
5 Answers, 1 is accepted
Rank 1
Dear dhlennon,
I had the same issue and achieved to remove the border with adding below css to my page:
.rrClipRegion{border:none !important;}
As this is a temporary solution for now, I'm sure Telerik guys will fix this bug asap.
Hope this helps
Ceki
Indeed, the border that previously appeared only in RadRotator types with buttons is now always shown. This behavior will be investigated by our developers.
When adding a border to the rotator control I would suggest overriding the CSS class rrClipRegion instead of using the inherited styling properties BorderStyle and BorderColor. These properties are modifying the built-in skins of the RadRotator and could lead to an unexpected behavior.
Kind regards,
Slav
the Telerik team
Rank 1
The other question is, I want this rad grid rotator to occupy just the half of the height of the screen, I would prefer to avoid hardcode the px values and prefer to have something in %.
.ascx
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DashBoardGrid.ascx.cs" Inherits="WebUserControlTest.WebUserControl1" %> <telerik:RadGrid ID="DashboardGrid" runat="server" PageSize="8" AllowFilteringByColumn="True" AllowSorting="True" CellSpacing="1" GridLines="None" onsortcommand="DashboardGrid_SortCommand"><MasterTableView><CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings><RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column"></RowIndicatorColumn><ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn><EditFormSettings><EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn></EditFormSettings></MasterTableView><FilterMenu EnableImageSprites="False"></FilterMenu></telerik:RadGrid>And here is how I am actually using the control Dashboard:Grid
<telerik:RadSplitter ID="Widget_Alert" runat="server" Width="100%" Height="100%"> <telerik:RadPane ID="WidgetPane" runat="server" Width="70%" Height="100%"> <div id="Grid" runat="server" style="width: 100%; position: absolute; height: 100%; right: 0; top: 10"> <telerik:RadRotator ID="GridShowCaseRotator" runat="server" Width="60%" ItemHeight="80" Height="100%" WrapFrames="false" ItemWidth="100%" RegisterWithScriptManager="true" RotatorType="Buttons" Visible="true"> <Items> <telerik:RadRotatorItem> <ItemTemplate> <Dashboard:IconGrid runat="server" ID="ph4" DatabaseEnum="4" HasStoredProcedure="false" QueryOrStoredProcedure="SELECT QUERY" /> </ItemTemplate> </telerik:RadRotatorItem> </Items> </telerik:RadRotator> </div> </telerik:RadPane> <telerik:RadPane ID="AlertPane" runat="server" Width="30%" Height="100%"> </telerik:RadPane> </telerik:RadSplitter>Thanks,
-Aarsh
The problem with the RadRotator items displacement during rotation is most probably caused by using percent values for the size properties of the control. The rotator does not support percent values and the properties Width, Height, ItemWidth, ItemHeight should be set in pixels. Please examine this help article for more information about properly configuring the rotator.
As for setting the rotator to occupy half of the screen's height without hard-coding the values, you can use the approach described in the Knowledge Base article Setting RadRotator's size in percent.
All the best,
Slav
the Telerik team
Rank 1