this recent topics template dose not stop on mouse hover

this recent topics template dose not stop on mouse hover i like to make it stop when mouse hover in the box
code is

Code:

                <!-- BEGIN scrolling_row -->
            
                <div align="center"><table class="forumline" width="100%" border="2" cellspacing="1" cellpadding="0">
                  <tbody><tr>
                      <td class="catLeft" height="40">
                        <span class="genmed module-title">{L_RECENT_TOPICS}</span>
                      </td>
                  </tr>
                  <tr>
                      <td class="row1" align="center">
        <marquee class="alt1" onmouseover="this.stop()" onmouseout="this.start()" direction="right" scrollamount="2" scrolldelay="60">
                        <!-- BEGIN recent_topic_row -->
                                    <img src="http://i18.servimg.com/u/f18/17/94/72/82/ap_new11.gif" alt="" /><a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a>
                        <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}
            
                        <!-- BEGIN switch_poster -->
                        <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->
                        <!-- BEGIN switch_poster_guest -->
                        <!-- END switch_poster_guest -->
                        <!-- END recent_topic_row -->
                                </marquee>
                              </td>
                  </tr>
                </table></div>
                <!-- END scrolling_row -->
        

What you have :

Code:

<marquee class="alt1" onmouseover="this.stop()" onmouseout="this.start()" direction="right" scrollamount="2" scrolldelay="60">

What it should be:

Code:

<marquee class="alt1" onmouseover="this.stop();" onmouseout="this.start();" direction="right" scrollamount="2" scrolldelay="60">

I think that's what the problem is, that code works on my forum.

how its works
im talking about it dose not stop scrolling on mouse hover

What browser are you using? The code works for Chrome, but I noticed it doesn't seem to work on firefox etc (but I rarely test for that cause I loathe firefox so LOL)

Idk what to tell you, hopefully someone comes with a code that works for firefox.
I've tried using jQuery in the widgets but that doesn't work either.

@Michael_vx
Have you made any recent changes on the template?
What are browser uses?

If you give us the address of your forum so we can see if it has any JavaScript error, everything will be easier to solve!

JS

What are browser uses?

Fire Fox yes
and i didnt know its works on Chrome
how to make it work on the Fire Fox then

Have you made any recent changes on the template?

its same as i find it so no changes from my side

@Michael_vx

I'll repeat:

JScript wrote:If you give us the address of your forum so we can see if it has any JavaScript error, everything will be easier to solve!

JS

I think that your problem is missing attribute id. Replace your code with the following code:

Code:

                <!-- BEGIN scrolling_row -->
         
                <div align="center"><table class="forumline" width="100%" border="2" cellspacing="1" cellpadding="0">
                  <tbody><tr>
                      <td class="catLeft" height="40">
                        <span class="genmed module-title">{L_RECENT_TOPICS}</span>
                      </td>
                  </tr>
                  <tr>
                      <td class="row1" align="center">
        <marquee id="comments_scroll_container" class="alt1" onmouseover="this.stop()" onmouseout="this.start()" direction="right" scrollamount="2" scrolldelay="60">
                        <!-- BEGIN recent_topic_row -->
                                    <img src="http://i18.servimg.com/u/f18/17/94/72/82/ap_new11.gif" alt="" /><a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a>
                        <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}
         
                        <!-- BEGIN switch_poster -->
                        <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->
                        <!-- BEGIN switch_poster_guest -->
                        <!-- END switch_poster_guest -->
                        <!-- END recent_topic_row -->
                                </marquee>
                              </td>
                  </tr>
                </table></div>
                <!-- END scrolling_row -->


@JScript
here a test forum link i use the template on
http://micsoft-test.forummotion.com

VX

@Michael_vx

1- You tested the tip from our friend @Zzbaivong?
2- Unfortunately a test forum is not consistent with the forum you use, unless it is an identical copy!

Your official forum may have errors that prevent various things work as they should...

JS

Replace your code with the following code:

Code:

<!-- BEGIN scrolling_row -->
<div align="center">
    <table class="forumline" width="100%" border="2" cellspacing="1" cellpadding="0">
        <tbody>
            <tr>
                <td class="catLeft" height="40">
                    <span class="genmed module-title">{L_RECENT_TOPICS}</span>
                </td>
            </tr>
            <tr>
                <td class="row1" align="center">
                    <marquee class="alt1" onmouseover="this.stop()" onmouseout="this.start()" direction="right" scrollamount="2" scrolldelay="60" dir="ltr">
                        <!-- BEGIN recent_topic_row -->
                        <img src="http://i18.servimg.com/u/f18/17/94/72/82/ap_new11.gif" alt="" />
                        <a href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a>
                        <img src="{ICON_TIME}" alt="" /> {scrolling_row.recent_topic_row.S_POSTTIME} {BY}&nbsp;
                        <!-- BEGIN switch_poster -->
                        <a href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->
                        <!-- BEGIN switch_poster_guest -->
                        {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}
                        <!-- END switch_poster_guest -->
                        <!-- END recent_topic_row -->
                    </marquee>
                </td>
            </tr>
    </table>
</div>
<!-- END scrolling_row -->

my official forum is MyBB not any related to forumotion
this Script not for me its for some people facing this non stop when hover for firefox users as i find out so at least lets find why its not working on firefox im thinking of something but i cannot do it now i have a bad stomich my belly hurts so much that i cannot stand it
Edit
Zzbaivong
its seems that still wont work

Your Firefox browser version?

The <marquee> tag is a non-standard, so it's functionality is sketchy across different browsers. Here's a fix that should work on new versions of Firefox :

Code:

                <!-- BEGIN scrolling_row -->
         
                <div align="center"><table class="forumline" width="100%" border="2" cellspacing="1" cellpadding="0">
                  <tbody><tr>
                      <td class="catLeft" height="40">
                        <span class="genmed module-title">{L_RECENT_TOPICS}</span>
                      </td>
                  </tr>
                  <tr>
                      <td class="row1" align="center">
        <marquee class="alt1" onmouseover="this.setAttribute('scrollamount', '0')" onmouseout="this.setAttribute('scrollamount', '2')" direction="right" scrollamount="2" scrolldelay="60">
                        <!-- BEGIN recent_topic_row -->
                                    <img src="http://i18.servimg.com/u/f18/17/94/72/82/ap_new11.gif" alt="" /><a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a>
                        <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}
         
                        <!-- BEGIN switch_poster -->
                        <a onmouseover="document.getElementById('comments_scroll_container').stop();" onmouseout="document.getElementById('comments_scroll_container').start();" href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->
                        <!-- BEGIN switch_poster_guest -->
                        <!-- END switch_poster_guest -->
                        <!-- END recent_topic_row -->
                                </marquee>
                              </td>
                  </tr>
                </table></div>
                <!-- END scrolling_row -->

That is :

- Replace stop() by setAttribute('scrollamount', '0')
- Replace start() by setAttribute('scrollamount', '2')
-- The 2 in the start replacement would be your default scrollamount on the element

This should work on all browsers, save for <IE9

The problem mostly occurs on Firefox, so you could identify the useragent via a script and make an Fx only fix, which I did before the Recent Topic widget update.

Oh. Thank @Ange Tuteur for useful information. I'm using version 38, maybe that's why I did not detect the error.

worked like a charm
thanks a lot Legendary Coder
im glad you that topic is solved

Zzbaivong wrote:Oh. Thank @Ange Tuteur for useful information. I'm using version 38, maybe that's why I did not detect the error.

The bug reared its ugly head shortly after the release of Firefox 27, and has been lurking since then. Not every Firefox user is affected, only a small minority; I was one of those people.

Michael_vx wrote:worked like a charm
thanks a lot Legendary Coder
im glad you that topic is solved

You're welcome.

good the topic still open
there is other problem with Chrome
width of the widget is overboard way way to wide
is there a way to solve this too

Add attribute dir="ltr" into marquee tag.

Code:

<marquee class="alt1" onmouseover="this.setAttribute('scrollamount', '0')" onmouseout="this.setAttribute('scrollamount', '2')" direction="right" scrollamount="2" scrolldelay="60" dir="ltr">

i did that still no use
same size over wide on Chrome

Add attribute width="800" into marquee tag.

oh my god so i was using this width="800" in the wrong place i did not add it inside the marquee tag its looking normal in chrome
thanks so much i was stupid i did not think right way