Modify ↓
Ticket #1622 (closed bug: wontfix)
Slide Up/Down bug with flashing
| Reported by: | Gonad | Owned by: | |
|---|---|---|---|
| Priority: | major | Milestone: | 1.2.2 |
| Component: | effects | Version: | 1.2 |
| Keywords: | slideup slidedown bug | Cc: | |
| Blocking: | Blocked by: |
Description
The slide up and down works perfectly however when the slide has finished, it looks like the element I'm performing the slide operation on, is flashing.
That is, it doesn't look smooth.
Try the code below in a browser.
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title> </title>
<script language="javascript" src="jquery.js"></script>
<script language="javascript">
var toggle = false;
function doStuff() {
if(!toggle) {
$("#mybutton").val("Slide Down");
$("#window_status").slideUp();
}
else {
$("#mybutton").val("Slide Up");
$("#window_status").slideDown();
}
toggle = !toggle;
}
</script>
<style type="text/css">
#window_status {
display: block;
}
.success_message {
padding: 10px;
background-color: yellow;
border: 2px solid black;
color: black;
font-size: 14px;
height: 100px;
}
</style>
</head>
<body>
<form>
<input type="button" id="mybutton" onclick="doStuff()" value="Slide Up">
<br><br>
<div align="center"><span id="window_status" class="success_message"></span></div>
</form>
</body>
</html>
Change History
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.
Note: See
TracTickets for help on using
tickets.
Animation changes the height which does not include padding, borders or margin. Instead of animating the span element, animate the parent div or wrap it in another div.