Bug Tracker

Opened 14 years ago

Closed 14 years ago

Last modified 14 years ago

#934 closed bug (worksforme)

buggy slideUp, slideDown when modifying html.

Reported by: anonymous Owned by:
Priority: minor Milestone:
Component: effects Version:
Keywords: Cc:
Blocked by: Blocking:

Description

I tried to create a box that closes itself, then changes its text, then opens itself, but I keep bugs on Firefox 2.

Here's the code :

<script type="text/javascript">
function showMessage(message) {
  // if the message box is visible, hide it, then change its text.
  $('#message:visible').slideUp('slow', function() { $(this).html(message); });
  // if the message box is hidden, just change its text.
  $('#message:hidden').html(message);
  // show the message box.
  $('#message').slideDown('slow');
}
</script>
<div id="message"></div><!-- intentionnaly let empty -->
<!-- Long text needed to ensure it's multiline to really see the scintillating -->
<button onclick="showMessage('Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.');">Set text 1</button>
<button onclick="showMessage('Text');">Set text 2</button>

If the message is initially empty, then the box shows a bit (height of some pixels) before opening completely, without the slide effect.

If I try to show more lines than there were, a scintillating effect occurs. If I try to show less lines than there were, the box slides down with the previous size, instead of the new size.

Change History (1)

comment:1 Changed 14 years ago by john

Resolution: worksforme
Status: newclosed

It seems like the best solution would be something like this:

$('#message').slideUp('slow',function(){
  $(this).html(message).slideUp('slow');
});

It seems like something that would be much simpler, and work more correctly.

Note: See TracTickets for help on using tickets.