jQuery.popeye 2.0 released

Posted on by

I have just released a new major version of my popular image gallery script jQuery.popeye. It features more customization options, better cross browser and mobile support and tons of bugfixes.

I have set up a jQuery.popeye site where you can find documentation and demos.

You will also find links to a new feature request forum and bug tracker there. Hope you like the new stuff!

96 thoughts on “jQuery.popeye 2.0 released”

  1. Hi Christoph

    Awesome plugin, very impressive!

    I’m trying to implement multiple galleries inside divs with “display:hidden” attributes, but I’m running into some problems. It seems as though the fact that the divs are hidden causes the galleries to not initialize properly. Some of them don’t load at all, and others are completely aligned off the screen.

    Have you come across this issue? Any ideas what I can do to make it work?

  3. Hi, great plugin, but I too am having an IE7 issue with z-indexing, and it also occurs in IE6. I have multiple popeyes on one page and when i expand one of them, it expands behind the other non-expanded galleries instead of on top, so the full size gallery is covered by the smaller ones. I have tried adjusting the z-index of several elements but have not been able to fix the problem. Could you help? thanks.

  4. This is a great plug in. I’m using multiple versions on a single page and am wondering what sets the overlap priority. My captions are being overwritten by subsequent examples further down the page. Any ideas for a work-around? You can see the work in progress at:

    http://davej.com/dev

    Any suggestions are welcome.

  5. Hi, I’m reposting about the issue I described in post #54. I’ve changed the z-indexing and it seems to be sorting things out in Firefox and Chrome (on a mac) I’ll test in IE on a PC later.

  6. Hi, I’ve got a sample site setup using multiple versions of popeye but have discovered a problem. When a user expands and then contracts one of the images, the z-index seems to get reset causing problems with overlapping images. Is there a way to retain the z-index setting?

    Thanks for any suggestions.

    the sample site can be seen at:

    http://davej.com/dev

  8. Hello,

    Is it possible to add a border to the pop up window but not have the border on the smaller photo?

    Any help would be great.

    Awesome plug in!

  9. Hello,
    very good job and first of all very useful!

    I woud like to ask you, is there any possibility how to use jQuery.popeye 2.0 on blogger/blogspot?

    Thank you very much for answer and good luck with next work.
    Tom

  10. I’ve been working on this popeye and really like the look of the thing. I’ve tried to use two of them on a page. but there’s only one showing. I’m using the 2.04 version. I’m quite new to jquery though..
    Is there somebody here that can help me on my way?

    cheers, Jan

  11. I’ve managed to do it. Davej thanks for your info. Took a good look at the code you use on your site.

    Love this jquery thing!

  12. about the IE7 caption bug, it actually didn’t show whole Caption if you have more words in the caption. even in your demo page, at ie7, if you enlarge the image 2, you can find it eat up half of flickr link and I find out it not a CSS problem. I like it very much and it really useful. Please fix this bug.

  14. I love Popeye. So glad the newest version fixed a lot of the trouble with IE7.

    I am having problems with my captions in all browsers. The image number changes (e.g. “2 of 4″), but the caption only changes in the enlarged mode, not in the smaller mode. The caption just sits there as the number changes. When enlarged, the caption will also change, and when you shrink back down it will show the proper caption, until you advance to the next image.

    Any ideas where I should look? The HTML for the caption seems to match the demos, and I don’t know enough to mess around in jquery.

    BTW, I am also having a z-index problem in IE7.

  16. Mi tutsimple emas danki vin pro disdoni ĉi tiun utilegan skripton.
    (I just want to thank you for doing this useful script and share it with us.)

    :-)

  17. Sure is a one of the most beautiful scripts i’ve seen , i was wondering if any one of you could help to download it every time i press download jquery plugin site take me to some other download ,many thanks in advance

  18. Same problem here, can’t download the plugin from the jquery website. Can someone help me to het the code? ;)

    Thanks, Tim

  20. Hi,
    Thank you very much for your great plug-in. Do this has feature to load the second or third or any other image as the first thumbnail.

    Because I’m having set of images and I’m going to load the image gallery in several places of the article. At each point the starting image should be different.

    Sorry for bothering you. Thank you anyway for your great work.

  22. Hi there,
    anyone having the same IE8-bugs?

    1) the Previous/Enlarge/Next-Buttons do show the hover-effect,
    but don’t get back to the “normal”-status after the cursor moves to another icon.

    2) enlarging the gallery images forces the image-headlines of my site (css: h1 { background.image: …) to lay “over” the gallery. So it looks like popeye enlarges underneath my headlines. I did try the zindex property, didn’t work.´;-(

    I would be glad if anyone could helo me out.
    Thank You

    Mitch

  23. Hi,

    I love this slideshow, thanks for building it.

    Is there a way of making the ppy-nav always visible, ie not just on hover? I can’t quite work out how (but I’m rubbish at Javascript).

    Thanks,

    Dave

  25. Hallöchen,

    ich hab die “Galerie” in einer for-Schleife laufen.
    Allerdings wird die Galerie nur bei der ersten Ausgabe der Schleife angezeigt.
    Im Quellcode wird alles geschrieben, aber angezeigt wird sie allerdings nur beim ersten.
    Gibt es dafür einen Fix, oder steh ich gerade einfach nur auf dem Schlauch?

    Grüße

  26. This is a great jquery module – love it for many reasons! Thanks.

    I have a page using 4 popeye instances, it has all been working perfectly (I thought), even in IE7 and was just about to launch it when I tested the interaction and found I was having similar IE7 z-index problems as mentioned above. In IE7 when expanding an instance of Popeye it is hidden behind other instances.

    Has anyone found an answer to this? If so, please post it here. I have tried using the zindex function and various settings, have tried replacing the absolute positioning with relative positioning, and much much more!

    Christoph, is there actually a work around to this issue or is it a known issue that I will have to live with?

    Check out http://www.adnova.com.au/adnova/ to see what’s happening in IE7.

    I have my fingers crossed!

  27. Hi, great plugin, works superbly for me in all but IE7, I seem to be having the same issue as Renee above.

    If you view http://designbychief.com/ms in IE7, you can see that enlarging the thumb goes behind the other instances.

    I thought it could be a css position issue but I have tried to resolve it with no avail. Any help would be appreciated! I’d really like to get this working so I get my site live. Thanks in advance! P.S again, great work!

  28. Hei guys,

    i have a feedback from my client, that when he tries (under IE7) to enlarge the image and than to close it (return to preview mode), popeye just coloses it self… i mean it does not retutns to previw mode and closes it self.

    it is very strange couse on my IE8 emulate IE7 its working perfect…

    do any have one idea?

    10x:)

  30. Hello Christoph.
    Is it possible to get the Enlargement view to remain inline in the content – so it does not open above other content in the page but just pushes it down (or up) as the image size changes. Is there a setting in the code to allow this?

    Many thanks
    Luke

  31. Once again,…the z-index issue. i think this bug makes PopEye unusal for me.
    Very sad, cause i like it, but IE7 Support is a must. i spent many hours in implementing and figuring out the z-index problem, but all known possibilities wont work.

  32. Hi! Is it possible to have more than 1 “example2″ popeyes on 1 page? doesn’t seem to work with several…

  33. I noticed an error when enlarging an image with popeye and seemingly found a pretty large oversight in the code.

    I really have no idea why you are calling the preload src like this:

    preloaderNext.src = a[i].href[neighbour];

    All that accomplishes is getting the first letter of the href. I’m assuming you meant to do this instead?

    preloaderNext.src = a[neighbour].href;

  34. when positioned at the bottom of the page (above footer) does not display properly (when viewing the enlarged pic)

  35. Hallo Christoph,

    ich muss erstmal ein großes Kompliment hier lassen, ich finde dein “Pop-Eye” super, und es lässt sich wirklich einfach implementieren. Mir stellt sich allerdings die Frage, ob es möglich ist, einen “Popeye”-Stil (margin, etc.) aber verschiedenen Größen in mehreren Containern in einer Seit zu bauen?

    Ich würde mich sehr über eine Antwort freuen

  36. Sorry but this “plugin” is garbage. You have a long way before you even come close to competing with lightbox.

    There is obviously something wrong with the plugin…followed everything to the T but it’s not working AT ALL. What a waste of time. Oh and by the way, how about organizing the documentation better?

  37. How can I call “next()” from a script?

    I mean… I’m really bad in javascript but I think that the solution is near for the autoplay.

    I’ve tried with

    function autoppy() {
    $('#ppy1').popeye.next();
    };

    setInterval('autopoppy()', 4000);

    but without success :(
    Can someone help me?

  38. Here is mine working solution for auto play (simply simulate clicking on next button):

    jQuery.noConflict();

    jQuery(document).ready(function () {

    function animatePPY() {
    jQuery(“.ppy-next”).click();
    }

    var popeyeOptions = {
    caption: “permanent”,
    navigation: “permanent”,
    direction: “left”
    }
    jQuery(“#ppy1″).popeye(popeyeOptions);

    setInterval(animatePPY, 4000); // 4 seconds

    });

  39. My experience with web design is not very extensive and neither is my knowledge of javascript and jQuery. I really like the popeye and tried to implement it on to my site. I followed the directions but it’s not working. I read all the other posts and wonder where I’m going wrong.

  40. Hello everybody,

    I like this project. Well done.

    However, I must admit, I can’t resize the image as desired when the Enlarge button is pressed. On that event, the image in the original size is shown. In my case, this is sometimes too large.

    Keep up the good work.

    Cheers,
    userFrodo

  41. Hi Guys,

    First, thanks for this great plugin!

    The sugested ie7 z-index fix (by @Edy & Arturo) did not work for me..
    I tried a few things and came up with this possible solution:

    On line 185 add:
    // set items z-index back to 0 when back to compact mode
    if($.browser.msie && $.browser.version == ’7.0′)
    {
    $self
    .parent(‘div’)
    .css(‘z-index’, 0)
    .siblings(‘div’)
    .css(‘z-index’,0);
    }

    and on line 294 (after $self.css(‘z-index’,opts.zindex);) add:

    // set items z-index to top
    if($.browser.msie && $.browser.version == ’7.0′)
    {
    $self
    .parent(‘div’)
    .css(‘z-index’, 1)
    .siblings(‘div’)
    .css(‘z-index’,1);
    }

    Hope this helps, good luck!

  42. Hi is it possible so that there is more than 1 of the little thumbnails on a page? So they can have different images in little gallery next to each other?

  44. can someone help my question is: where I can resize the frame of the pics when it gets large with the enlarge button, I need this because I do not fit the in the div.
    thanks