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

PauseOnMouseOver not working

6 Answers 70 Views

Rotator

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

Peter asked on 06 Oct 2015, 11:04 AM

i have the following issue, i have a very basic page with a rotator on it.

but PauseOnMouseOver doesnt seem to be working, it simply wont pause on mouse over.

i am using the latest version of telerik

fyi the cdn bits is because i use a local version of it, but again thats the latest version.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RotatorPage.aspx.cs" Inherits="EAP.popups.RotatorPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<link href="../site/css/Common.css" rel="stylesheet" type="text/css" />

<link href="../site/css/Header.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">

function OnClientItemsRequestFailed(sender, eventArgs) {

var errorMessage = eventArgs.get_errorMessage();

eventArgs.set_cancelErrorAlert(true);

}

</script>

</head>

<body style="background-color:white !Important;">

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

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

<CdnSettings TelerikCdn="Enabled" BaseSecureUrl="https://host/cdn/Scripts" BaseUrl="https://host/cdn/Scripts" />

</telerik:RadScriptManager>

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" EnableStyleSheetCombine="False">

<CdnSettings TelerikCdn="Enabled" BaseUrl="https://host/cdn/Skins" BaseSecureUrl="https://host/cdn/Skins" />

</telerik:RadStyleSheetManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Bootstrap">

</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" EnablePageHeadUpdate="true">

<div class="rotator-container">

<telerik:RadRotator ID="headlinesRotator" runat="server" ScrollDirection="Left" Width="500"

WrapFrames="true" FrameDuration="1" PauseOnMouseOver="true"

ScrollDuration="8000" Height="15" ItemHeight="15" ItemWidth="250"

CssClass="rotator">

<WebServiceSettings Path="../Services/EclipseService.asmx" Method="GetRotatorData" />

</telerik:RadRotator>

</div>

</telerik:RadAjaxPanel>

</form>

</body>

</html>

6 Answers, 1 is accepted

answered on 12 Oct 2015, 03:43 PM

Hi Peter,

We examined the provided code again and noticed that the ScrollDuration property is set to pretty big value, giving the feeling that the scrolling does not stop when the Rotator is hovered. What actually happens though, is that by design the rotation stops when the currently showing item (the last one) i fully shown, so if the scroll duration is big this will take more time. You can easily test that by hovering over the rotator item and leaving the mouse over it, unless the last item is fully displayed - then the Rotator will be paused.

In order to make the Rotator pause the rotation imediately you will need to give smaller time frame to the Rotator's ScrollDuration property.

Regards,
Vessy
Telerik

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 Feedback Portal and vote to affect the priority of the items

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting

Testing & Mocking

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

PauseOnMouseOver not working

6 Answers, 1 is accepted