Results 1 to 6 of 6

Thread: A Question About Image Power Zoomer v1.2

  1. #1
    Join Date
    Nov 2017
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default A Question About Image Power Zoomer v1.2

    1) Script Title: Image Power Zoomer v1.2

    2) Script URL (on DD): I am working on my local PC

    3) Describe problem: I want to use your Image Power Zoomer on my local pc for my project. I have an image and some buttons which are changing the src of the image.

    Zoomer is working good but because of it is working on document ready function, zoomer always showing the first image even though I click on the button and change the source of the image.

    And my question is,

    How can I run the zoomer when I click on the button, not on document load?

    I try to do that but cannot be successfull.

    I would be glad if you can help me.

    With my kind regards.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,375
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    We have lots of zooming scripts here. Which one exactly? Please link to the demo page where you got the script.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Nov 2017
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your replay.

    Tle script demo link is http://www.dynamicdrive.com/dynamici...owerzoomer.htm

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,375
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    I would try using remove or replaceWith (both jQuery functions available because this script already requires jQuery). If replaceWith works, great. Otherwise you would have to remove and then append, or before and then remove. The remove command is supposed to kill everything about any element removed using it (like events and attributes assigned via jQuery). So let's say you have something like so:

    Code:
    <div id="imgholder">
    <img src="ocean.gif" style="width:200px; height:150px">
    </div>
    And let's say you already initialized it in the head of the page like so:

    Code:
    <script type="text/javascript">
    jQuery(document).ready(function($){ //fire on DOM ready
     $('#imgholder, img').addpowerzoom()
    })
    </script>
    Later you could run code like this:

    Code:
    jQuery('#imgholder, img').replaceWith('<img src="someother.jpg" style="width:250px; height:175px">');
    jQuery('#imgholder, img').addpowerzoom();
    which would replace that image with another, and then initialize the new image to power zoom.

    or maybe you need remove, in which case it would go like so:

    Code:
    jQuery('#imgholder, img').remove();
    jQuery('#imgholder').append('<img src="someother.jpg" style="width:250px; height:175px">');
    jQuery('#imgholder, img').addpowerzoom();
    I think I can run these scenarios on the demo page using the console to see if either or both work, and if anything else is required. But I might not be able to test that way.

    In any case, do you know how to use the code I just gave you? You could make it a function and/or a click event for some element the user would click on to switch to that new image. Changing back would be like:

    Code:
    jQuery('#imgholder, img').replaceWith('<img src="ocean.gif" style="width:200px; height:150px">');
    jQuery('#imgholder, img').addpowerzoom();
    or (using remove and append):


    Code:
    jQuery('#imgholder, img').remove();
    jQuery('#imgholder').append('<img src="ocean.gif" style="width:200px; height:150px">');
    jQuery('#imgholder, img').addpowerzoom();
    Whichever works, assuming at least one of them does, replaceWith is easier if it works, you can keep on changing the image in this fashion whenever you like, to whatever image you like.

    Edit: Added later - Just tested this and the replaceWith method appears to work fine.
    Last edited by jscheuer1; 11-08-2017 at 04:46 PM. Reason: tested and works
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Nov 2017
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,
    I am very thankful to you. I tried everything but couldn' t be successfull.
    After your suggestion I realize that when I change the src of the image I was tryin to add zoom to the image using:

    $('#imgimage').addpowerzoom();

    and were getting error.

    But when I use

    jQuery('#imgimage').addpowerzoom();

    I become successful.

    Thanks a lot for your help.

    Regards.

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,375
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    I was going to make a note about that in my previous post. But didn't want to confuse things. I noticed this was one of the older jQuery scripts from DD. At that time he was making everything jQuery.noConflict(), which meant it was or at least could be compatible with other libraries which used the $ variable and also with other versions of jQuery already on use on the page.

    But it also meant you had to use jQuery, not $ when activating/using the script outside of a jQuery closure. If this is the only jQuery script on the page, and you're not using any other libraries or code that need the $ variable, you can get rid of:

    Code:
    jQuery.noConflict()
    from the main script and use $('#imgimage').addpowerzoom(); even if it's outside of a jQuery closure.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. Image Power Zoomer v1.2 issue
    By kemiq in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 10-18-2017, 04:18 PM
  2. Image Power Zoomer
    By mani in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 10-03-2016, 12:45 PM
  3. Power Zoomer plus Image Map?
    By jkoke in forum Dynamic Drive scripts help
    Replies: 11
    Last Post: 04-01-2012, 12:55 AM
  4. Bug with Image Power Zoomer v1.1
    By spuddle in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 07-08-2011, 07:24 PM
  5. PHP & Image Power Zoomer
    By funkfact in forum PHP
    Replies: 1
    Last Post: 11-17-2010, 06:36 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •