StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POjQuery hide and show not properly (multiple times)
text
Body
copied!<p>I'm having a problem with my project, on combination with jQuery/Coffeescript.</p> <p>On my homepage I have a block with text, with an arrow underneath it. Under there, there are buttons, and every time I have my mouse over one of those buttons, I want the text block + arrow to move. I do this with the jQuery UI library, with the method <code>hide</code> and <code>show</code>.</p> <p>In my CSS code I made several classes: <code>.position1</code>, <code>.position2</code> and <code>.position1</code>. Every time over hover with my mouse over one of the buttons, I want the text block to move to a specific position, so I change it's class (if someone has a better solution, I would gladly like to hear it).</p> <p>Now the problem I'm having, is that sometimes the arrow hides and appears multiple times after each other (especially when I move my mouse very fast between the buttons)</p> <p>A simple (partial) version of my jQuery is as follows:</p> <pre><code>var appear_arrow = function(to_position, show_delay) { removeClasses($('.arrow')); $('.arrow').addClass(to_class); $('.arrow').delay(show_delay).show('slide', 'slow'); }; var to_position1 = function() { $('.arrow').hide(0); $('.text_block').hide(appear); switchClass($('.text_block')); $('.text_block').show(appear); appear_arrow('position1', delay); }; $('.button1').hover( function() { to_position1(); }, function() {} ); </code></pre> <p>My question, does anybody know why sometimes the arrow is appearing multiple times. Or does someone has a suggestion how to better do this?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload