Skip to content

Instantly share code, notes, and snippets.

@tomykaira
Created May 20, 2011 13:09
Show Gist options
  • Save tomykaira/982853 to your computer and use it in GitHub Desktop.
Save tomykaira/982853 to your computer and use it in GitHub Desktop.
Test for jQuery UI Bug:#6245 position: absolute is lost when .stop() is used with .show('blind').
<!DOCTYPE html>
<!-- http://jsfiddle.net/6RD5a/1/ -->
<html>
<head>
<style type="text/css"> #element { background: green; } </style>
<script type="text/javascript" src="../../jquery-1.5.1.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="../../ui/jquery.effects.core.js"></script>
<script type="text/javascript" src="../../ui/jquery.effects.explode.js"></script>
<script type="text/javascript" src="../../ui/jquery.effects.blind.js"></script>
<script type="text/javascript" src="../../ui/jquery.ui.droppable.js"></script>
<script type="text/javascript">
$(function () {
var eff = "blind"
$('#hoverme-stop').hover(function() {
$(this).find('.help').stop(true, true).show(eff, {duration: 1000});
}, function() {
$(this).find('.help').stop(true, true).hide(eff, {duration: 1000});
});
});
</script>
<style type="text/css" media="screen">
#hoverme-stop {
position: relative;
height: 200px;
background: #abcdef;
}
.help {
position: absolute;
left: 100px;
top: 100px;
}
</style>
</head>
<body>
<div id="hoverme-stop">
Some other text
<div class="help">Help Help Help</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment