PDA

View Full Version : Multizoom not working,, please help



eugenm26
01-19-2014, 02:35 AM
Hello Everyone, please help,,
I have been trying to make working the multizoom, but no success.
All done as by the instructions, also in the HEADER file I did edit and replaced the; ('#image1') with ('Irimg') only, due to the page showing my images got this; <img src=' ' id='Irimg'>
The pictures are showing as before but no sign of zooming.
Please help, I appreciate very much your response,
Thanks a lot,,

jscheuer1
01-19-2014, 04:17 AM
Use:

'#Irimg'

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

eugenm26
01-19-2014, 07:02 PM
Use:

'#Irimg'

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

The website page is; http://www.cityfreeads.com/canada/index.php?ct=&md=details&id=42

Eugen,

jscheuer1
01-20-2014, 04:49 AM
Get rid of this:


$('lrimg').addimagezoom({ // single image zoom
zoomrange: [3, 10],
magnifiersize: [300,300],
magnifierpos: 'right',
cursorshade: true,
largeimage: 'hayden.jpg' //<-- No comma after last option!
})


this:


$('#multizoom1').addimagezoom({ // multi-zoom: options same as for previous Featured Image Zoomer's addimagezoom unless noted as '- new'
descArea: '#description', // description selector (optional - but required if descriptions are used) - new
speed: 1500, // duration of fade in for new zoomable images (in milliseconds, optional) - new
descpos: true, // if set to true - description position follows image position at a set distance, defaults to false (optional) - new
imagevertcenter: true, // zoomable image centers vertically in its container (optional) - new
magvertcenter: true, // magnified area centers vertically in relation to the zoomable image (optional) - new
zoomrange: [3, 10],
magnifiersize: [250,250],
magnifierpos: 'right',
cursorshadecolor: '#fdffd5',
cursorshade: true //<-- No comma after last option!
});

$('#multizoom2').addimagezoom({ // multi-zoom: options same as for previous Featured Image Zoomer's addimagezoom unless noted as '- new'
descArea: '#description2', // description selector (optional - but required if descriptions are used) - new
disablewheel: true // even without variable zoom, mousewheel will not shift image position while mouse is over image (optional) - new
//^-- No comma after last option!
});


this:


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


this:


<script src="http://www.cityfreeads.com/canada/jquery-1.4.2.min.js" type="text/javascript"></script>
<script>var jq = jQuery.noConflict(); </script>


and this:


<script language='JavaScript'>
jq(document).ready(function(){
jq('#lrimg').hide();
jq('#pht1 a').click(function(){
jq('#lrimg').hide(); jq('#dvlimg').show();
jq('#dvlimg2').html("<p>&nbsp;<p><font class='stfnt' style='color: #777777'>Loading...</font><p>&nbsp;<p>");
var imgpth = jq(this).attr('href');
jq('#lrimg').attr({ src: imgpth });
jq('#lrimg').fadeIn('1000');
jq('#dvlimg2').html("<font class='smallfnt' style='color: #999999'>click the photo to hide</font>");
return false;
});

jq('#lrimg').load(function(){jq('#lrimg').fadeIn('1000');
jq('#dvlimg2').html("<font class='smallfnt' style='color: #ff9966'>click the photo to hide</font>");
});

jq('#dvlimg').click(function(){jq('#dvlimg').fadeOut('');
});
});
</script>


Add the # symbol here:


$('#lrimg').addimagezoom() // single image zoom with default options


Here get rid of DISPLAY: none; :


<div id='dvlimg' STYLE="DISPLAY: none; position: absolute; z-index: 5; ">
<table width='450' bgcolor='#ffffff' border=0 cellspacing=10 cellpadding=0 class='tb4'>
<tr><td>
<center>

<img src='' id='lrimg' />


And come up with a src and dimension attributes for the image.

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

There could still be other problems.

eugenm26
01-21-2014, 02:47 AM
Thank You John, I tried but still no avail,,
*Removing the last two codes as you suggested it causes the pictures go out of the webpage, ( no background ) though the pictures are showing, NO zoom either.
*Removing the, DISPLAY;none: crates another empty small shade box on the page above the details box.
*Adding the symbol;#: shows NO large pictures, it shows a shaded shape of the real picture .
I understand it is hard, especially since you have no direst access to the webpage,, Me? to be honest, I never had any training on any scripting,, I learned a bit just for fan and it is all can do..
I can live with it as it is,, zoom or no zoom,, but if ever the zoomer would work, I would be very happy to compensate your precious time in $..
We can try something else,, in you have the time,,
Thank you a lot, and have a wonderful day John.
Eugen.

jscheuer1
01-21-2014, 03:32 AM
Make a separate copy of the page. Follow all of the instructions. If it's still not working, give me a link to it.