CODEWITHSUNDEEP
jqueryasp.nethtmlzooming
Eric
Eric

Reputation: 8078

Jquery image Zoomer function not getting called

I am trying to implement the image zoom found on this website, but I am having issues getting it to work in my website. I add the .js and .css files to the root and referenced the files in javascript as instructed, but it seems i never reach jquery function. What am I doing wrong? I get no errors on the page. When I hover over the image nothing happens.

 <head id="Head1" runat="server">  
    <link rel="stylesheet" href="multizoom.css" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>

<script type="text/javascript" src="multizoom.js">
  jQuery(function ($) {
    $('#image1').addimagezoom({ // single image zoom
        zoomrange: [3, 10],
        magnifiersize: [300, 300],
        magnifierpos: 'right',
        cursorshade: true,
        largeimage: 'someImage.jpg' //<-- No comma after last option!
    })
})
</script>

</head>

 <img id="image1" border="0" src="someImagesmall.jpg" style="width:250px;height:338px">

Upvotes: 0

Views: 832

Answers (1)

Anders Lind&#233;n
Anders Lind&#233;n

Reputation: 7323

Use two script tags:

<script type="text/javascript" src="multizoom.js"></script>

and

<script type="text/javascript">
  jQuery(function ($) {
    $('#image1').addimagezoom({ // single image zoom
        zoomrange: [3, 10],
        magnifiersize: [300, 300],
        magnifierpos: 'right',
        cursorshade: true,
        largeimage: 'someImage.jpg' //<-- No comma after last option!
    })
})
</script>

Upvotes: 3

Related Questions