The demo your looking at uses jquery 1.3.1 and the ui version 1.6rc6. try upgrading your versions.
On Thu, Feb 26, 2009 at 8:07 AM, Eddie <[email protected]> wrote: > > Dear Sir/Madam, > > I try to modify the sample "http://jqueryui.com/demos/ > effects_general/#transfer<http://jqueryui.com/demos/%0Aeffects_general/#transfer>" > such that when the element "transfer- > target" is clicked, it will show/hide the "transfer" element. However, > if the element "Transfer" is set to be an absolute layer and set to > different position. It is find that the effect cannot track to the > right position. Below is the modified code. Please take it and try and > you'll know what I mention. > > Just want to know if there is any alternative. Thanks. > > ---------------------------------------------------------------------------------- > > <!doctype html> > <html lang="en"> > <head> > <title>jQuery UI Effects - Transfer Demo</title> > <link type="text/css" href="themes/ui.all.css" rel="stylesheet" /> > <script type="text/javascript" src="js/jquery-1.2.6.js"></script> > <script type="text/javascript" src="js/jquery-ui- > personalized-1.5.3.js"></script> > > <link type="text/css" href="themes/demos.css" rel="stylesheet" /> > <style type="text/css"> > .ui-effects-transfer { border: 2px dotted gray; } > #transfer { width: 240px; height: 135px; padding: 0.4em; } > #transfer h3 { margin: 0; padding: 0.4em; text-align: > center; } > #transfer-target { width: 80px; height: 80px; margin-top: > 80px; } > </style> > <script type="text/javascript"> > $(function() { > $("#transfer").click(function() { > $(this).effect("transfer", {to: "#transfer-target"}, > null, function > () {$(this).hide();}); > }); > > $("#transfer-target").click(function() { > if ($("#transfer").is(':visible')) { > $("#transfer").effect("transfer", { to: > "#transfer-target"}, null, > function() {$("#transfer").hide();} ); > } else { > $(this).effect("transfer", { to: > "#transfer"}, null, function() {$ > ("#transfer").show();} ); > } > }); > }); > </script> > </head> > <body> > > <div class="demo"> > > <div id="transfer" class="ui-widget-content ui-corner-all" > style="position:absolute; left:114px; top:65px; border:1px solid > #f00"> > <h3 class="ui-widget-header ui-corner-all">Transfer</h3> > > <p> > Etiam libero neque, luctus a, eleifend nec, semper at, > lorem. Sed > pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, > mi. > </p> > </div> > > <div id="transfer-target" class="ui-widget-header" style="border:1px > solid #666"></div> > > </div><!-- End demo --> > > <div class="demo-description"> > > <p> > Click above to preview the <code>.effect("transfer")</code> effect. > > </p> > > </div><!-- End demo-description --> > > </body> > </html> > > > ---------------------------------------------------------------------------------- > > > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
