We have a simple rotator with four images. The control clips the sides of the left and right images (see attached graphic). Is there some way to bunch the images up closer to avoid the clipping?
Failing that, is there some formula to know how to size either the images or the rotator to ensure that no clipping will occur, to prevent trial and error testing? For example, if the rotator is to be 900 pixels how wide can the images be without clipping?
Failing that, is there some formula to know how to size either the images or the rotator to ensure that no clipping will occur, to prevent trial and error testing? For example, if the rotator is to be 900 pixels how wide can the images be without clipping?
<
div
style
=
"height: 450px; background-color: #f0f3f6;"
>
<
asp:Image
ImageUrl
=
"~/images/carousel_rt.gif"
ID
=
"img_right"
AlternateText
=
"right"
runat
=
"server"
Style
=
"cursor: pointer; float: right; margin-top: 180px;"
/>
<
asp:Image
ImageUrl
=
"~/images/carousel_left.gif"
ID
=
"img_left"
AlternateText
=
"left"
runat
=
"server"
Style
=
"cursor: pointer; float: left; margin-top: 180px;"
/>
<
telerik:RadRotator
ID
=
"radCarousel1"
runat
=
"server"
Width
=
"900px"
ItemWidth
=
"575px"
Height
=
"430px"
ItemHeight
=
"255px"
ScrollDuration
=
"1000"
FrameDuration
=
"3000"
RotatorType
=
"CarouselButtons"
Style
=
"margin: 0px auto 0px auto;"
>
<
Items
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
img
src
=
"images/carouselicount.jpg"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
img
src
=
"images/carouselplatform.jpg"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
img
src
=
"images/carouselpeople.jpg"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
<
telerik:RadRotatorItem
>
<
ItemTemplate
>
<
img
src
=
"images/carouselprograms.jpg"
/>
</
ItemTemplate
>
</
telerik:RadRotatorItem
>
</
Items
>
<
ControlButtons
LeftButtonID
=
"img_left"
RightButtonID
=
"img_right"
/>
</
telerik:RadRotator
>
</
div
>