jQuery Image Magnify v1.11 can't get to work [Archive]

drakebarb

03-03-2013, 05:12 AM

1) Script Title: jQuery Image Magnify v1.11

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/imagemagnify.htm

3) Describe problem: I can not get this script to work. Put script in the <HEAD>, saved the two files: jquery.magnifier.js. in folder called js and the magnify.cur is in the root directory. I added the class="magnify" to a picture at Line 185, Line 187 and it won't work. Help!...what am I doing wrong?:eek: Here's the page I am working on: http://www.sleezybarbhorsewear.com/bootcovers.htm

jscheuer1

03-03-2013, 06:21 PM

First off, save a backup just in case. Then in the head of the page, replace:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

with:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>

After the script for jQuery Image Magnify, add this highlighted script as shown:

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

/***********************************************
* jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script type="text/javascript">
var $ = jQuery
</script>

Remove this line from the head:

<script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script>

Finally you need to replace the semi-colon (red) in the compound class name with a space:

<img src="webpictures/BootCoverpic_small.jpg" alt="horse Professional Choice boots covers,
horse splint boot covers" class="style3;magnify" style="float: right" width="100" height="131"/>

So you get:

<img src="webpictures/BootCoverpic_small.jpg" alt="horse Professional Choice boots covers,
horse splint boot covers" class="style3 magnify" style="float: right" width="100" height="131"/>

Save all those changes and use that version of the page.

The browser cache may need to be cleared and/or the page refreshed to see changes.