Marquee tag is not working in google chrome to stop on mouseover [Resolved]

Posted by Poojawadekar under ASP.NET on 3/3/2016 | Points: 10 | Views : 10028 | Status : [Member] | Replies : 3

Write New Post |

Search Forums | Answered

Resolved Posts |

Un Answered Posts |

Forums Home

I have write below code to stop marquee on mouseover. It's working f9 in firefox but not working in google chrome.
Here is code.

<marquee id="marqueeHeader" behavior="alternate" direction="left" onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);" loop="true" width="100%" bgcolor="transparent" runat="server">
<asp:label id="lblHeaderAnnoucement" runat="server" cssClass="marqueeText" Text ="Hi" />
</marquee>

[Resolved]

Reply | Reply with Attachment

Alert Moderator

Responses

Posted by: A2H on: 3/3/2016 [Member] [MVP] Silver | Points: 50

0	However you should consider using other options as marguee is depreciated. One option is to use Jquery Marquee plugins. You can use the liscroll Jquery plug in to create a Marquee control in your page. http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html Complete Code: <html> <head> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <link href="http://cdn.imnjb.me/libs/liscroll/1.0/li-scroller.css" rel="stylesheet" type="text/css" /> <script src="http://cdn.imnjb.me/libs/liscroll/1.0/jquery.li-scroller.1.0.js"></script> <script> $(function () { //Call the below function to create a Marquee $("ul#marquee").liScroll(); }); </script> <style> .tickercontainer { height: 40px !important; } </style> </head> <body> <form runat="server" id="form1"> <ul id="marquee"> <li> Text to scroll </li> </ul> </form> </body> </html> Sample Demo : http://jsbin.com/cojefoximi/edit?html,output Thanks, A2H My Blog Poojawadekar, if this helps please login to Mark As Answer. \| Alert Moderator

However you should consider using other options as marguee is depreciated. One option is to use Jquery Marquee plugins. You can use the liscroll Jquery plug in to create a Marquee control in your page.
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html
Complete Code:

<html>

<head>

    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

    <link href="http://cdn.imnjb.me/libs/liscroll/1.0/li-scroller.css"

        rel="stylesheet" type="text/css" />

    <script src="http://cdn.imnjb.me/libs/liscroll/1.0/jquery.li-scroller.1.0.js"></script>

    <script>

        $(function () {

            //Call the below function to create a Marquee

            $("ul#marquee").liScroll();

        });

    </script>

    <style>

        .tickercontainer

        {

            height: 40px !important;

        }

    </style>

</head>

<body>

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

    <ul id="marquee">

        <li>

            Text to scroll

        </li>

    </ul>

    </form>

</body>

</html>

Sample Demo : http://jsbin.com/cojefoximi/edit?html,output

Thanks,
A2H
My Blog

Poojawadekar, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Professionaluser on: 3/3/2016 [Member] [MVP] Bronze | Points: 25

0	refer http://htmlasks.com/marquee_not_working_in_chrome http://forums.asp.net/t/1930080.aspx?Marquee+Repeatter+is+not+working+in+Chrome+and+IE Poojawadekar, if this helps please login to Mark As Answer. \| Alert Moderator

Posted by: A2H on: 3/3/2016 [Member] [MVP] Silver | Points: 25

0	Use start and stop function to stop scrolling on mouse over like below <marquee id="marqueeHeader" behavior="alternate" direction="left" onmouseover="this.stop()" onmouseout="this.start()" loop="true" width="100%" bgcolor="transparent" runat="server"> <asp:label id="lblHeaderAnnoucement" runat="server" cssClass="marqueeText" Text ="Hi" /> </marquee> Thanks, A2H My Blog Poojawadekar, if this helps please login to Mark As Answer. \| Alert Moderator

Use start and stop function to stop scrolling on mouse over like below

<marquee id="marqueeHeader" behavior="alternate" direction="left" onmouseover="this.stop()" onmouseout="this.start()" loop="true" width="100%" bgcolor="transparent" runat="server">
            <asp:label id="lblHeaderAnnoucement" runat="server" cssClass="marqueeText" Text ="Hi" />
        </marquee>

Thanks,
A2H
My Blog

Poojawadekar, if this helps please login to Mark As Answer. | Alert Moderator

Latest Posts