Feb 21

FancyZoom in iWeb, huh? What’s that. Well there are a many websites these days that have that popular image zoom effect so that when you click on the image it animates the photo larger. Well many have asked, how can I do that with iWeb? Well here it is, this is the tutorial to show you just how to do that. Keep in mind this one is a bit more complex, but it can be done without getting your hands to dirty in code.

58 Responses to “Video Tutorial-FancyZoom in iWeb”

  1. Alice says:

    mine didn’t work! :( do i have to publish it to see the changes? (i just clicked make hyperlinks active)

  2. Andy says:

    Hi,
    I have the following problem: If I need to change something in iWeb on this page and publish it again, all the new FancyZoom code is gone and I have to do it all again. Is there a trick to solve this problem?

  3. Israel says:

    Works great in testing but not on the actual internet (after publishing)… Any ideas what the problem is?

    Thanks in advance!

  4. dustin says:

    Is there a way to adjust the size of the zoom once you click on the image??

  5. Jan says:

    Hi Jason,

    I’ve seen this comment many times but never and answer if im not mistaking:
    I do exactly as you told, but when i click on a picture it just opens up in a new
    window ( this window has nothing except for the enlarged picture in the upper left corner).
    No zoom whatsoever, any idea what the problem could be?

    I’m on iweb 08

    Many thanks in advance for your help

  6. hope123 says:

    I have tried several times and can not get this to work. Like many others I am getting a separate window when I click on my photos. It seems a bit strange that so many people are experiencing the very same problem. Any thoughts on what major oversights may be occurring?

    Thanks!

  7. Ayeisha says:

    Will someone on iwebunlimited answer Hope and Jan’s question? I have the same one and have looked everywhere for an answer to no avail…

    thanks in advance!

  8. Mr.L says:

    Jan, Hope123, and Ayeisha I had the same problem and I fixed it. Hopefully this can you all out also. I couldn’t figure it out until I stared at the screen making sure I did everything correctly. Make sure you have done these things. 1. Link the picture to it’s self, 2. Publish your site, then save your work. 3. download that fancyzoom folder and then put it IN your website folder. THAT was where I think I messed up. Then do the HTML editing like the video says AND SAVE YOUR WORK. Then go check out your site. (MAKE SURE THE FANCY ZOOM FOLDER GOES IN YOUR WEBSITE FOLDER :). Andy I have the same problem as you :(

  9. Mr.L says:

    I GOT IT LADIES AND GENTS!!! lol

    JAN, HOPE AYEISHA – I don’t know why but when you put the fancy zoom folder in you website folder, IT DOESNT ALWAYS STAY IN THERE. So if you update your site or something it won’t be in there. SO ALWAYS MAKE SURE THE FANCY ZOOM IS IN YOUR WEBSITE FOLDER :)

    ANDY – I GOT IT! lol After replacing the codes and all that MAKE SURE YOU “SAVE AS” (NOT “SAVE”) and it will replace that old folder with the new folder that has the new codes. BUT if you ever want that original html folder (the one before the code changing) HIT “SAVE AS” on it BEFORE you change anything and save it to your documents or desktop or where ever. THEN you can start changing the code :) Hope this helped you all!

    ALICE – You HAVE TO PUBLISH AND SAVE your work on iWeb after doing the steps. FOLLOW THE VIDEO VERY CLOSELY :)

    DUSTIN) – How do I put this… For faster loading purposes I made my pictures a smaller file size version (for my website) THAN MY ORIGINAL, now in the video he says, “… link the picture to its self…” now what I did was link the smaller picture to my original pic OR you can link it to a BIGGER version of your pic so that you wouldn’t need to zoom. I use Photoshop to mess with file sizes. You can also use preview which is good too :)

    Hope I helped you all!!

  10. kmcdow says:

    I have transfered the FancyZoom folder into my idisk: web-sites -overhead slam (site name)- it downloads into site folder. Now this is where I am lost…. Look for fancyzoom.html and it does not appear. I go into fancyzoom folder and the only html extension is labeled FancyZoomHTML.js. It will not give me the codes to continue to step 5.

    Recap of my actions.
    set up photos on my bio page
    create hyperlink to a file for each photo
    published site
    download fancyzoom folder
    put into idisk
    web – sites – Overhead_Slam
    fancy-zoom folder is shown
    and now NOTHING – WHAT AM I DOING WRONG? HELP

  11. need help says:

    hello…

    when i open up the html file in textedit it shows all the pictures .. text and all that stuff but no codes… how could i make this to show the codes and not the photos and stuff…

    thx already

  12. need help says:

    never mind… i downloaded coda and it works great :D thx anyway =D

  13. Hi IJason
    Thanks to upload your knowledge.
    I have a problem with my fancyzoom. I put a few pictures just down of a flash galery and when I click on the picture the zoom its appear under the flash galery. How can i put on the top???
    Thanks a lot.

  14. Guy says:

    How we can adjust the speed of zooming?

  15. ZeljkoK says:

    Could you please tell me were the download is for the Image zoom? I can’t seem to find it.

  16. Ari says:

    Hi I am just stuck ehen the coding part comes when i open the html file no codes show, only my images…what am I doing wrong?

  17. JP says:

    how do i do this when not using mobile me but using FTP?
    Pleae help

  18. RMS says:

    how do i do this when not using mobile me but using FTP?
    Please help!!!!!!!!!!

  19. Austin says:

    This is working well for me, but every time I republish the website from iweb, the html file reverts back and I have to go in and redo the changes that make it work. Are there any ways around this?

Leave a Reply

preload preload preload