Skip to main content

Bug Tracker

Side navigation

Ticket #6309: animatebug.html

File animatebug.html, 2.1 KB (added by Screeze, March 18, 2010 01:25PM UTC)

Example code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
<html xmlns="">
      <title>Client validator test page</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <script src="" type="text/javascript"></script>
   <div id="notworking" style="border: 1px solid red;">
   This one is not working.
   <div id="working" style="border: 1px solid black;">
   This one is working.
   <input type="button" id="buttonNotWorking" value="try not working example (watch firebug console!!)">
   <input type="button" id="buttonWorking" value="try working example">
      <script type="text/javascript">
        $("#notworking").data("animationproperties", { opacity: 0.25, left: '+=50', height: 'toggle' });
        $("#notworking").data("animationoptions", {'duration':150});
        $("#working").data("animationproperties", { opacity: 0.25, left: '+=50', height: 'toggle' });
        $("#working").data("animationoptions", {'duration':150});
        $("#buttonNotWorking").bind('click', function(){
            var divNotWorking = $("#notworking");
            var anprop ="animationproperties");
            var anopt ="animationoptions");
            divNotWorking.animate(anprop, anopt);
            var divWorking = $("#working");
            var anprop ="animationproperties");
            var anopt ="animationoptions");
            // clone the objects
            var anpropClone = jQuery.extend(true, {}, anprop);
            var anoptClone = jQuery.extend(true, {}, anopt);
            divWorking.animate(anpropClone, anoptClone);

Download in other formats:

Original Format