Here is my RadRotator:
and the javascript configuration:
It is fine in IE 8: coverflow-ie8.png
but images are too big or distorted in IE6: coverflow-IE6-a.png and coverflow-IE6-b.png
<
telerik:RadRotator
ID
=
"rotator1"
runat
=
"server"
BorderWidth
=
"0"
RotatorType
=
"CoverFlowButtons"
Width
=
"100%"
ItemWidth
=
"64"
Height
=
"80px"
ItemHeight
=
"64"
ScrollDuration
=
"500"
FrameDuration
=
"2000"
EnableRandomOrder
=
"true"
PauseOnMouseOver
=
"false"
Skin
=
"Windows7"
ScrollDirection
=
"Left, Right"
OnClientItemShown
=
"OnClientItemShown"
CssClass
=
"RemoveRotatorBorder"
>
<
ItemTemplate
>
<
asp:Image
ID
=
"Image1"
runat
=
"server"
ImageUrl='<%# Eval("Url") %>' AlternateText='<%# Eval("Name") %>' />
</
ItemTemplate
>
</
telerik:RadRotator
>
and the javascript configuration:
Telerik.Web.UI.RadRotatorAnimation.set_scrollAnimationOptions(
"<%= rotator1.ClientID %>"
,
{
xR: 5,
// The offset in pixels between the selected items and the first item on the left and on the right of the selected item.
xItemSpacing: 20,
matrix: { m11: 1, m12: 0, m21: -0.1, m22: 1 },
// The 2d transformation matrix, applied to the items that appear on the right of the selected item
reflectionHeight: 0.5,
// The height of the reflection
reflectionOpacity: 1
// The opacity, applied to the reflection
}
);
It is fine in IE 8: coverflow-ie8.png
but images are too big or distorted in IE6: coverflow-IE6-a.png and coverflow-IE6-b.png