I am in the process of learning jquery and thought that I would try and duplicate some common flash functionality in jquery. Just to see if I could get it to work.
I was able to get the code working but run into an error on I.E that I do not see in firefox. Could someone please give me an idea why I get a flicker when viewing the menu in I.E that doesn't appear in Firefox? Original Flash Version http://www.gm.com My JQuery Version http://www.indyscripters.com/gm_rebuild_burst_plugins.html Thanks in advance **Here is my plugin code.** (function($){ $.fn.bubbleMenu = function(menuContent) { $(menuContent).hide(); $(this) .hover(function(e){ e.preventDefault(); this.blur(); var method1 = 'easeInOutQuad'; $(menuContent) .animate({height:'toggle'},{duration:500,easing:'easeInOutQuad'}) .show(); },function(e){ e.preventDefault(); this.blur(); $(menuContent) .animate({height:'toggle'},'slow', function () { $(menuContent).hide(); }); }) return this; } })(jQuery); **Here is my code for the page** <html> <head> <script type="text/javascript" src="jquery/jquery-1.2.3.js"></script> <script type="text/javascript" src="plugins/jquery.easing.1.3.js"></ script> <script type="text/javascript" src="plugins/ jquery.jqia.bubbleMenu.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#corporate").bubbleMenu('div#corporate > div.content'); $("#experience").bubbleMenu('div#experience > div.content'); $("#vehicles").bubbleMenu('div#vehicles > div.content'); }); </script> <link type="text/css" rel="stylesheet" href="css/gm_rebuild.css"> </head> <body> <table width="800" border="0" align="center"> <tr> <td> </td> </tr> <tr> <td> <table align="center" cellspacing="20" width="600" border="0" height="500" id="mainframe"> <tr> <td valign="middle"> <!-- Corporate Information Area --> Corporate Information <table id="menuitems" cellpadding="0" cellspacing="1" border="0"> <tr><td></td></tr> <tr><td class="menuitem">Corporate Information Home</td></tr> <tr><td class="menuitem">About GM</td></tr> <tr><td class="menuitem">Corporate Responsibility</td></tr> <tr><td class="menuitem">Investor Information</td></tr> <tr><td class="menuitem">Careers</td></tr> <tr><td class="menuitem">Dealers & Suppliers</td></tr> <tr><td class="menuitem">Employees & Retirees</td></tr> </table> <!-- Corporate Information Area --> </td> <td> GM Vehicles <table id="menuitems" cellpadding="0" cellspacing="1" border="0"> <tr><td></td></tr> <tr><td class="menuitem">GM Vehicles Home</td></tr> <tr><td class="menuitem">Current Offers</td></tr> <tr><td class="menuitem">Dealer Locator</td></tr> <tr><td class="menuitem">Guides & Brochures</td></tr> <tr><td class="menuitem">Services</td></tr> <tr><td class="menuitem">Parts & Accessories</td></tr> <tr><td class="menuitem">Certified Used Vehicles</td></tr> <tr><td class="menuitem">Fleet * Commercial</td></tr> </table> </td> <td> Experience GM <table id="menuitems" cellpadding="0" cellspacing="1" border="0"> <tr><td></td></tr> <tr><td class="menuitem">Experience GM Home</td></tr> <tr><td class="menuitem">Fuel Economy & Alternatives Fuels</td></tr> <tr><td class="menuitem">Safety</td></tr> <tr><td class="menuitem">Quality</td></tr> <tr><td class="menuitem">Technology</td></tr> <tr><td class="menuitem">Entertainment & Special Events</td></tr> <tr><td class="menuitem">Auto Shows</td></tr> <tr><td class="menuitem">Education</td></tr> </table> </td> </tr> </table> </td> </tr> <tr> <td> </td> </tr> </table> </body> </html>
