Jquery Zoom [Support thread]

[niccol]

ok. probably the best place to put the js scripts that I sent is includes/modules/pages/product_info . That way they will only load on the product info page.

the module you can set as an override at includes/modules/your_template/additional_images.php

the template can go at includes/templates/your_template/templates/tpl_modules_main_product_image.php

then beyond that I'd need to see a URL to tell you why it is not playing.

[day2]

ok. probably the best place to put the js scripts that I sent is includes/modules/pages/product_info . That way they will only load on the product info page.

the module you can set as an override at includes/modules/your_template/additional_images.php

the template can go at includes/templates/your_template/templates/tpl_modules_main_product_image.php

then beyond that I'd need to see a URL to tell you why it is not playing.

Hi Niccol,

OK, i have done the above, and JS script now is only applicable to includes/modules/pages/product info, as i realized inside this folder there is a jscript_main.php. hence i put the following script in this php file

"<script type="text/javascript" src="includes/js/jscript_jqzoom_init.js"></script>
<script type="text/javascript" src="includes/js/jscript_jquery.jqzoom-core.js"></script>
"

<?php
//
// +----------------------------------------------------------------------+
// |zen-cart Open Source E-commerce                                       |
// +----------------------------------------------------------------------+
// | Copyright (c) 2003 The zen-cart developers                           |
// |                                                                      |
// | http://www.zen-cart.com/index.php                                    |
// |                                                                      |
// | Portions Copyright (c) 2003 osCommerce                               |
// +----------------------------------------------------------------------+
// | This source file is subject to version 2.0 of the GPL license,       |
// | that is bundled with this package in the file LICENSE, and is        |
// | available through the world-wide-web at the following url:           |
// | http://www.zen-cart.com/license/2_0.txt.                             |
// | If you did not receive a copy of the zen-cart license and are unable |
// | to obtain it through the world-wide-web, please send a note to       |
// | [email protected] so we can mail you a copy immediately.          |
// +----------------------------------------------------------------------+
// $Id: jscript_main.php 5444 2006-12-29 06:45:56Z drbyte $
//
?>
<script language="javascript" type="text/javascript"><!--
function popupWindow(url) {
  window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes,copyhistory=no,width=100,height=100,screenX=150,screenY=150,top=150,left=150')
}
function popupWindowPrice(url) {
  window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=no,width=600,height=400,screenX=150,screenY=150,top=150,left=150')
}
//--></script>

<script type="text/javascript" src="includes/js/jscript_jqzoom_init.js"></script>
 <script type="text/javascript" src="includes/js/jscript_jquery.jqzoom-core.js"></script>

You can see a sample of URL here:

http://mmo.net.my/storev2/index.php?...roducts_id=549

It doesn't seem working..

[day2]

I just realised i do not need to modify the jscript_main.php, i just need to copy the 2 java script files into the "includes/modules/pages/product info" folder

However, the impact is still the same, please look at the URL below to see why it did not load. Really thanks for the help:

http://mmo.net.my/storev2/index.php?...roducts_id=549

[niccol]

@day2

I'll have a look at this as soon as I can. Got to say that I am flat out busy at the moment so it will be a short while. I'll package it up into a proper module at the same time.

Nick

[niccol]

Just installed fine on a site I am building. Well, OK I had forgotten a css file but that is now rectified. The more complete version is attached.

Looking at your site I suspect that the reason it doesn't work is the version of jQuery that is loaded on the site. That is an OLD version :-) Some of the stuff that jqzoom use were introduced in version 1.2.6 . That was a long time ago.

You need to update your version. You can download a recent version easily enough but I would think about using a version from a CDN - either jquery themselves or google. If you search for something like 'loading jquery from google' you'll find information. Others may disagree with this but to me it makes more sense.

And for anyone else trying this - you will need to have jQuery loaded on the site one way or another. That is not included in the files so you will have to make it happen if it is not already loaded.

[day2]

Just installed fine on a site I am building. Well, OK I had forgotten a css file but that is now rectified. The more complete version is attached.

Looking at your site I suspect that the reason it doesn't work is the version of jQuery that is loaded on the site. That is an OLD version :-) Some of the stuff that jqzoom use were introduced in version 1.2.6 . That was a long time ago.

You need to update your version. You can download a recent version easily enough but I would think about using a version from a CDN - either jquery themselves or google. If you search for something like 'loading jquery from google' you'll find information. Others may disagree with this but to me it makes more sense.

And for anyone else trying this - you will need to have jQuery loaded on the site one way or another. That is not included in the files so you will have to make it happen if it is not already loaded.

Hi Niccol,

I have made a test to remove all javascript in my webstore, only run your jscript_jquery.jqzoom-core.js & jscript_jqzoom_init.js.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<head>
<title>M-Audio Q40 Studiophile Closed-Back Headphones [Studiophile-Q40] : MMO Music Store, Great Price! Great Products!! Great Service!!!</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="M-Audio Q40 Studiophile Closed-Back Headphones [Studiophile-Q40] Amplifier Guitar Effects Live Sound System Recording Keyboard & Piano Drum & Percussion Accessories DJ Tools Redemption Item Effect ecommerce, open source, shop, online shopping" />
<meta name="description" content="MMO Music Store M-Audio Q40 Studiophile Closed-Back Headphones [Studiophile-Q40] - Closed-back circum-aural design delivers excellent isolation from ambient noise.Whether you're tracking, mixing or listening, you can expect sonic accuracy from your Studiophile Q40 headphones-designed by M-Audio, leading provider of reference monitor technology. With professional-grade dynamic drivers and ear cups that completely surround the ears, the Q40 headphones deliver full-range specs " />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="author" content="The Zen Cart&trade; Team and others" />
<meta name="generator" content="shopping cart program by Zen Cart&trade;, http://www.zen-cart.com eCommerce" />

<base href="http://mmo.net.my/storev2/" />
<link rel="canonical" href="http://mmo.net.my/storev2/index.php?main_page=product_info&amp;products_id=385" />

<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/style_imagehover.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/style_jscroller.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet_betterCategoriesEzInfo.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet_css_buttons.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet_dotline.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet_footer_menu.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/all_business/css/stylesheet_jquery.jqzoom.css" />
<link rel="stylesheet" type="text/css" media="print" href="includes/templates/all_business/css/print_stylesheet.css" />
<script type="text/javascript" src="includes/modules/pages/product_info/jscript_jquery.jqzoom-core.js"></script>
<script type="text/javascript" src="includes/modules/pages/product_info/jscript_jqzoom_init.js"></script>
<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="includes/templates/all_business/css/ie6.css" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" type="text/css" media="screen" href="includes/templates/all_business/css/ie7.css" /><![endif]-->
</head>

<body id="productinfoBody">

<div id="mainWrapper">



<!--bof-header logo and navigation display-->

<div id="headerWrapper">
<!--bof-navigation display-->
<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
    <li><a href="http://mmo.net.my/storev2/">Home</a> | </li>
    <li><a href="http://mmo.net.my/storev2/index.php?main_page=login">Log In/Free Registration </a> | </li>

                                                
    <li><img src="includes/templates/all_business/images/cart.jpg" class="cart-image" alt="the shopping cart" /><a href="http://mmo.net.my/storev2/index.php?main_page=shopping_cart">Shopping Cart - 0 item(s) - RM0.00</a> | </li>
    <li><a href="http://mmo.net.my/storev2/index.php?main_page=checkout_shipping"><span class="header-checkout">Checkout</span></a></li>
</ul>
</div>
<br class="clearBoth" />
</div>
<!--eof-navigation display--> 

It is still not working.

I have make search on the source file to ensure no additional jscript was loaded as well.

[day2]

Thanks Niccol, a new version of jquery has get it work.

Thanks.

[philip937]

Just installed fine on a site I am building. Well, OK I had forgotten a css file but that is now rectified. The more complete version is attached.

Looking at your site I suspect that the reason it doesn't work is the version of jQuery that is loaded on the site. That is an OLD version :-) Some of the stuff that jqzoom use were introduced in version 1.2.6 . That was a long time ago.

You need to update your version. You can download a recent version easily enough but I would think about using a version from a CDN - either jquery themselves or google. If you search for something like 'loading jquery from google' you'll find information. Others may disagree with this but to me it makes more sense.

And for anyone else trying this - you will need to have jQuery loaded on the site one way or another. That is not included in the files so you will have to make it happen if it is not already loaded.

doesnt work.

when I hover, the small image is displayed.. ?