NotOneBit Blog

Get started today on your next web project with NotOneBit
We've been doing web development before you were born *

39 thoughts on “jQuery Panel Gallery 1.2 Plugin Released

  1. Quick question – if one were to set “sections:1,” would that allow for fading the the full images between one another?

    1. @beginner
      Yes. If you change sections to 1 just be sure to also set the overlap to 1 otherwise you may get a strange flicker. The effect is a nice subtly fade from one image to another.

      1. Hi,
        I love the smooth visual effect and would like to use this plugin on one of my wordpress sites. Can you tell me or send me a link with information on how to integrate it in wordpress?
        Many thanks in advance and thanks for the plugin!

  2. Cool plugin. The gallery looks like a video :) So can you make more effect on changing photo from one to another? I’d like some effect in Windows Movie Maker. If it can be done, that’s great. We can show our gallery as a “real” video slideshow.

  3. Hi, great work!

    But I receive a lot
    error in parsing value for ‘background-image’. Declaration dropped.
    in Firefox 3.5.5
    I am using v1.2

  4. Your scripts are fantastic, I have written down ideas on paper for my new website but struggled implementing them since I haven’t coded one line of code in 7 years and when I went looking for already made jquery scripts I could not believe that this panel transition effect for images was available ^_^ dammit I cannot wait to finish the graphics and implement it on parts of my site and get it ready before then end of the year!!! (not to mention the multiple other wonderful scripts on here I’m sure I will find a way to use)

  5. Hi there-

    I’ve been using this plugin as v1.1 for awhile and thought I would check out v1.2. There is a bug in the new version – when cross-fading between two images, the fade will skip the last 20% or so. This introduces a weird, jumping sensation into an otherwise smooth transition. Compare it to the v1.1 side-by-side and youll see exactly what Im talking about.

    I did settings of:
    imageTransitionDelay :2500,
    sectionTransitionDelay : 2000,

    The effect was present in Firefox 3.5, Chrome and Safari4. Otherwise, this a great little jquery plugin – I love its small size and versatility.

  6. I am new to Javascript and jQuery and have found trying to find out how to do a simple animated slideshow with fades rather frustrating. Your plug-in changed that. Simple, yet visually elegant. One question, when I test using Firefox I don’t get any of the section effects as I do using IE. Instead, Firefox treats the slideshow as if I am using one section.

  7. thanks for your good work
    Might I suggest you adding something like below [into your js] to stop mouse flickering in IE6

    //– flickering cursor for IE6 but not IE7, Moz, Safari, Opera…
    if (typeof == “undefined”) {
    try {
    document.execCommand(‘BackgroundImageCache’, false, true);
    } catch(e) { /* unless it’s not IE6… */ }
    } // if

    1. @scott
      Nice addition but since I’m anti-IE6 I won’t be adding this to compensate for that dinosaur. Yes people still use it, but that doesn’t mean that we should continue to encourage them to do so.

      1. Hehe
        well good on you – my sentiment is with you
        not sure I could get away with that though


  8. Can anyone tell me why the PanelGallery on my web site at does not work in IE6 (and possibly IE7)? The code does not work at all, and all the images show at once all the way down the page, covering up the text.

    I realize IE6 is going out, but several of my customers apparently still use it. *shrug* Can’t lose potential business because the site doesn’t work properly!

    1. Hilton,

      I’m having the same problem. The pic gallery works beautifully on Firefox and Safari, but IE displays all the pictures in a vertical line, covering the text on the page.
      Were you able to find a solution?

      1. I don’t have experience in this field. I just downloaded jquery into the site as instructed and copied the plug-ins within the head tag as instructed. From the get go it worked fine with FIrefox and Safari, but running this on a PC with IE, it just doesn’t work. Instead of the pictures sliding one at a time in the container, they just display statically one under the other and covering the rest of the page. I’m going to try to look for a different way of displaying the pics and hope it goes ok with IE.

  9. Hello, and thank you for such a gorgeous little plugin. Delightful!
    Quick question:
    Using the plugin in Firefox 3.5.8 OS X (re your article on mac’s – how about swapping a bit of mac testing for a bit of pc?!) All works great, but if I move the cursor over the gallery div, it turns the the hourglass and the transitions stop. A slightly annoying – can I do anything about it?
    Ok, one more question. Is it possible to use this plugin with links on the images?
    Many thanks for your great work. T

    1. Ok – please ignore the mouse over bit – I was tied and didn’t read your very clear description of the new “Pause” function. Apologies! :)

  10. Is there any plans for basic caption support, using title attributes or similar? Would love to be able so style a semitransparent white caption layer on top of each image but failed to when I first tried (the license prohibits me from doing it too, no?)



    1. Hm, guess I could make the caption as a totally separate div this time, and populate it with the caption using javascript. But is there a callback for when each image is loaded that I can use?

    2. Hmmm, captions seem like an interesting idea for this plugin. I’ll see what it would take to add that as an option. The license for this plugin should allow you to change it as long as you ask for permission when redistributing it.

      1. OK. I managed to get captions going by adding a callback to your plugin, and using that to populate a separate div with the alt-text of each image, when animation was completed.

        FYI, I added (on line 25):
        callback : function(){}

        …and then later down (on line 169):

        Using this I called it with:

        callback: function(obj){
        var image = $(“img:visible:last”, obj);
        var text = image.attr(“alt”);

        Hope that helps those with similar questions/ideas.


  11. Hi, thanks for great plugin. It is just what I want and it works when I use it on its own.
    But something is wrong, I am sure this is my fault but I have tried to figure it out for so long now without finding the solution… The plugin works fine but has a conflict with my other jquery plugins. For example ; if I add the .panelGallery in the end of my the .accordion plugin before it doesnt load anymore. If I take ,panelGallery out of the and add it in the webpage before instead, then It wont work unless I take away the link to wich I need since my navbar runs with a jquery plugin.
    (I suppose you can not have two “$(function(){” calls – but my problem is: Why can I not add your plugin to my with the other jquery plugins without having a conflict?
    (I am in dreamweaver , Safari & Firefox testing)
    Would love to understand what is going on…

    The end of my (wich works fine without the .panelGallery – code):
    collapsible: true,
    active: false,
    autoHeight: false
    $(‘#picContent’).panelGallery( {
    sections: 1,
    imageTransitionDelay : 40000,
    sectionTransitionDelay : 1000,
    startDelay : 60000,
    repeat:true });

    1. I found out where I was wrong; sorry to have bothered you – I am new to all this as you can see…
      (I had only loaded the files needed for that webpage to work but I now realize I must also include the other js files that are called for in my, otherwise the loading gets “stuck”. Maybe there is a way to get around this but my problem is solved at least so I am happy.)
      Apologies, again and Thanks for plugin!

  12. Great stuff.. Noticed one issue. When I images that are 1200 x around 477 pixels I get a gap at the top of the image. When the transition completed the image jumps. I double checked the image sizes and they are all the same size… Any ideas?

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: