[SOLVED]Hovering on product thumbnail changes image size

[kingsinnersoul]

Hello,

In the BO I have went to Performance > Image and added a new image size type. I named it mySizeMedium, and I gave it 300px by 300px, and checked the of Products.

Then I regenerated the thumbnails.

Lastly, I went to the prodcut.tpl file and chagned the image_block div to the following:

 <div id="image-block">
  {if $have_image}
<span id="view_full_size">
 <img src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'mySizeMedium')}"{if $jqZoomEnabled} class="jqzoom"{/if} title="{$product->name|escape:'htmlall':'UTF-8'}" alt="{$product->name|escape:'htmlall':'UTF-8'}" id="bigpic" width="{$mySizeMedium.width}" height="{$mySizeMedium.height}"/>
 <span class="span_link">
  {l s='Maximize'}
 </span>
</span>
  {else}
<span id="view_full_size">
 <img src="{$img_prod_dir}{$lang_iso}-mySizeMedium.jpg" id="bigpic" alt="" title="{$product->name|escape:'htmlall':'UTF-8'}" width="{$mySizeMedium.width}" height="{$mySizeMedium.height}" />
 <span class="span_link">
  {l s='Maximize'}
 </span>
</span>
  {/if}
 </div>

 

When I refreshed the product page I can see the first image in the new size I set. But when I check the page's code source I see height="" width="" as no width was set to the img tag.

 

Now, when I hover over the thumbnails of the other images of that prodcut, the image changes, but the size changes as well to the old size.

 

I am using PS 1.5.4.1 default theme, could anyone please instruct me on the right change process/method that I have to go through in order to add a new Image Size, and then append it to the prodcut page images?

 

Thank you in advacne.

Edited June 13, 2013 by kingsinnersoul (see edit history)

[kingsinnersoul]

Ok, I figured out that when I add a new image type (my case mySizeMedium) and then change the product page, I had to change the javescript as well. In the JS folder there was a product.js and around line 422 I changed "large" to "mySizeMedium". That did the trick. But I am still seeing width="" height="" in the #bicpic html.