.animate() - Queue Simulation for older jquery Verions (Drupal) Conflict

im searching for a solution to come out with the jquery Version, which Drupal is including natively. Its a older version. Actually there are nooo problems - but one :D I use a .animate() function with a queue false, and without this attribute (because this attribute was addet to .animate() in jquery 1.7), it is not animating as i want.

The code is:

//When mouse rolls over
$("#login").bind('mouseover mouseenter',function(){
$("#logo").stop().delay(500).animate({top:'-44px'},{queue:false, duration:600, easing: 'swing'})

$("#login").stop().animate({top:'89px'},{queue:false, duration:600, easing: 'easeOutBounce'})
});

//When mouse is removed
$("#login").bind('mouseout mouseleave',function(){
$("#logo").stop().animate({top:'6px'},{queue:false, duration:600, easing: 'easeOutBounce'})

$("#login").stop().animate({top:'40px'},{queue:false, duration:600, easing: 'swing'})
});


Maybe you can help me find a solution? The problem, why i want to exclude the jquery version I used for this (1.8.3) is that a Drupal Module is not showing up the wysiwyg (CKEditor), when jquery 1.8.3 is inlcluded additionaly and unfortunately i cant replace the jquery version of the core with jquery 1.8.3 :(

I have always done this via regular-old vanilla js; by simply firing the event on delay/timeout. This combats the queue problem.

[Check this out on JsFiddle.][1]


[1]:

[To see links please register here]

"registering the event on delay"
<style type="text/css">
.redBlock{
height:2em;
background-color:red;
color:white;
border:2px solid silver;
}​
</style>
<input type="button" id="testFoo" value="click me a bunch of times super fast" />
<div id="testBar" style="width:100px;" class="redBlock"> Red Block </div>​
<script type="text/javascript">
$(document).ready(function(){
$("#testFoo").click(function(){
fireOneAnimateEvent();
});
});
function animateRedBlock() {
$("#testBar").css('width', '100px')
.animate({
width: ($("#testBar").width() * 3) + "px"
}, 500, function () { });
}
var delay = (function () {
var timer = 0;
return function (callback, ms) {
clearTimeout(timer);
timer = setTimeout(callback, ms);
};
})();
function fireOneAnimateEvent() {
delay(function () {
animateRedBlock();
}, 500);
}​
</script>