How can I get the jquery gzoom plugin working? -
i have picked jquery plugin called gzoom the gzoom site seems able want (variable zoom). have seen previous question on stackoverflow seems have been resolved. not familiar js , jquery, , missing easy.
i have downloaded custom version of latest jquery-ui (with jquery) - version 1.11.2 - pdc folder. have downloaded 2 gzoom files - jquery.gzoom.css , jquery.gzoom.js. testing on wamp, outside wordpress environment now.
my html file (adapted above sources)
<!doctype html> <html> <head> <meta charset="utf-8"> <title>test gzoom</title> <link rel="stylesheet" href="/pdc/jquery-ui-1.11.2.custom/jquery-ui.min.css"> <script src="/pdc/jquery-ui-1.11.2.custom/external/jquery/jquery.js"></script> <script src="/pdc/jquery-ui-1.11.2.custom/jquery-ui.min.js"></script> <link rel="stylesheet" href="/pdc/gzoom/css/jquery.gzoom.css" type="text/css" media="screen"> <script type="text/javascript" src="/pdc/gzoom/jquery/jquery.gzoom.js"></script> <style> div#zoom{ cursor: crosshair; } </style> </head> <body> <div id="gzoomwrap"> <div id="zoom" class="zoom minizoompan"> <img src='/wp/wp-content/uploads/hcn-sign-for-palette.jpg'/> </div> </div> <script type="text/javascript"> /*<![cdata[*/ $(function() { $zoom = $("#zoom").gzoom({ sw: 300, sh: 225, lw: 1400, lh: 1050, lightbox : false }); }); /*]]>*/ </script> </body> </html> the image , slider display ok, when move slider image not change. error can see (using chrome)
uncaught typeerror: cannot read property 'replace' of undefined jquery.gzoom.js:94 , line var hisrc = ig.attr("src").replace(settings.re, settings.replace);
i have tried 1 or 2 different jquery versions have had same problem. have done wrong? thanks
jquery
No comments:
Post a Comment