TypeError: $(...).jqueryzoom is not a function

[mohamedali]

hi all,

 

i am using jquery zoom tool in product list page to zoom product image when hover..

 

it works fine..when i configure "top image slider"  an error occurs..

 

TypeError: $(...).jqueryzoom is not a function

 

 included code inside product-list.tpl is,

 

<script type="text/javascript" src="{$content_dir}js/jquery/jquery.jqzoom.js"></script>

 

<link media="screen" type="text/css" rel="stylesheet" href="{$content_dir}/css/jqzoom.css"/>

 

<script type="text/javascript">

 

{literal}

 

var jqZoomEnabled = true;

 

//To do after loading HTML

 

$(document).ready(function()

 

{

 

$('img.jqzoom').jqueryzoom({

 

xzoom: 200, //zooming div default width(default width value is 200)

 

yzoom: 200, //zooming div default width(default height value is 200)

 

offset: 21 //zooming div default offset(default offset value is 10)

 

//position: "right" //zooming div position(default position value is "right")

 

});

 

});

 

{/literal}

 

</script>

[berka.pavel]

try this http://stackoverflow.com/questions/12343714/typeerror-is-not-a-function-when-calling-jquery-function

[mohamedali]

hi pavel ,

 

i changed what said but still same error occurs.

 

jQuery(document).ready(function($)

 

{

 

$('img.jqzoom').jqueryzoom({

 

xzoom: 200, //zooming div default width(default width value is 200)

 

yzoom: 200, //zooming div default width(default height value is 200)

 

offset: 21 //zooming div default offset(default offset value is 10)

 

//position: "right" //zooming div position(default position value is "right")

 

});

 

});

 

 

if i add jQuery.noConflict(); before jQuery(document).ready(function($),

 

the top slider doesn't work...

Edited March 6, 2014 by mohamedali (see edit history)