Pikachoose jQuery Image Gallery

Follow us on twitter!

Pikachoose

Sponsors

Demo 2.x


Pikachoose is a lightweight Jquery Image Gallery plugin that allows easy presentation of photos with options for slideshows, navigation buttons, and auto play. Pikachoose is designed to be easily installed, easy to setup, and well… all around easy. Creating an javascript image gallery shouldn’t be a complex thing.

Now PikaChoose comes packaged with SliderJS. Alot of people have been asking me for a carousel for PikaChoose, and SliderJS will fulfill your needs! Instructions are included in how to add SliderJS onto your slideshow, but its easy enough to figure out just by peeking at the source code in the included example. I’m positive you’ll choose PikaChoose as your javascript image gallery!

  • Links are now supported in captions!
  • Or any other html you wish to include.
  • You can even change the text for any of the text prompts!
  • Use your own thumbnails or let PikaChoose create them for you!
  • Coding should be simple. There is no gallery easier to use than Piakchoose!
  • I’d be happy to link to your site on the homepage. Just contact me.

This example and images are available in the download section. I’d love to hear if you’re using PikaChoose! Please leave me a comment below!

223 Responses to “Demo 2.x”

  1. Rumor says:

    Hello,

    I just want to let you know I seem to be having the same issue as Gyle in IE6/7. The gallery loads but it doesn’t load the first image and instead just shows an IE picture icon instead. If you click on one of the thumbnails though, it does work. I put a link to the page in the Website field.

    Also the hovers don’t seem to be working properly in IE6/7, but that I don’t care too much about

    I thought it was a conflict with Dean Edwards’ IE8 library, but even with it gone it still doesn’t work

    Help? Thanks

  2. kanle485 says:

    Can’t we use a css class for adding multiple picachoose galleries? Because i have to duplicate the css ids like #pikame1 li, #pikame2 li … and instead using
    $(”#pikame1″).PikaChoose()
    $(”#pikame2″).PikaChoose()
    can’t we use a class like
    $(”.pikame”).PikaChoose() for all the gallery instances

    • admin says:

      Absolutely. You can use any jQuery selector to pick the lists that contain your images. If you do it using a class like that you can’t define options for each gallery.

  3. Hi, I think your script is great! After having issues with a similar jQuery script Pikachoose is a welcome alternative.

    However, I’m having an issue in IE7 where the thumbnail for a portrait image isn’t being resized, it’s just being shown as the full image. Any ideas?

    • admin says:

      I haven’t run into this before. I’ll check when I get home to my PC and then I’ll let you know.

  4. Jamie says:

    Without major hacking here do you thinks it’s fairly straight forward to add a lightbox hook to the main image? I am fairly decent at jq hacking if I have a direction to start.

    Thanks!

    • admin says:

      The main image has a src that should match the thumbnail. It also has a class of .pika_main I imaging you could call lightbox to run on that, but I’m not sure if you’d need to update it after every transition. Let me know what you find out.

  5. OpieTee says:

    Great plugin!

    Some questions though:
    1. is there a way to not show the main image, until all thumbs are loaded. The whole layout on my page is getting altered while the images are loading. Then it returns to “normal” when thumbs are loaded.
    2. and also; when I click a picture, it takes me to another gallery page, showing the picture in “fullsize”. What I need is a way to return to the gallery, and have the same image displayed in pikachoose.
    Any JS script that can “pick” the thumb () to show??

  6. puijob says:

    Does the SliderJS have its own page or some documentation? I didn’t find it on http://plugins.jquery.com/ either.

    • admin says:

      At this time there isn’t. There seemed to be a lack of interest in the plugin so I kinda let it fizzle out. I may try to build up some documents for it at a later date.

  7. puijob says:

    Does the 2.6.2 version still provides carousel effect? The 2.4 works on jquery 1.2 which is inconvenient.

  8. Gyle says:

    I just found an IE bug and it’s really getting on my nerves.hehe I’ve been playing with the parameters and IE 7’s not playing the slideshow automatically whenever i use the user_thumbs. Also tried to dig on the js script but it’s too risky.hehe
    Hope you could help me..:(

  9. Gyle says:

    Amazingly nice script. Love it! Thnx so much for this!

  10. puijob says:

    Is there a way to have the thumbnails display vertically, on 1 column for example, and maintain the carousel effect?

  11. morph says:

    Hello! Your script works really great, but could you please provide the html for next previous buttons as 2 separate divs, so it can be positioned in more flexible way?

  12. Berto says:

    Hello again, and yes the caption show was false so I fixed it. I have another question. I added text to the caption but some of the text overlaps the thumbnail part, Do i have to modify something from the css to move the thumbnails down more so the text doesnt overlap it?

    • admin says:

      Yes. There is a div that is created with a class of pika_caption. In your css just modify that div’s height to make more room for your captions.

  13. yetkin says:

    hello m8, it’s pretty cool gallery but that’s slider js is not working with jquery1.3
    is there any fix for it ?
    thanks for your effort
    regards

    • Michael says:

      It took a bit, but to make sliderjs.js work with jquery 1.3 change line 63 in sliderjs.js from

      var $sliderjs = $(this).parent(”);

      to

      var $sliderjs = $(this).parent(”div”);

      BAM!

  14. Berto says:

    Hello, your gallery is awesome. But I cant see the text under the pic. I dunno what im doing wrong, all I did was just replace the demo text you put in and it doesnt show up.

    • admin says:

      Are there any options set when you call the PikaChoose function? ie. $(’#id’).PikaChoose({show_captions:false;})

      Either clear out the options, or set show_caption:true and let me know if that helped.

  15. allan says:

    wow this one is great… Thanks. Your web also is one of the that i saw lately.

  16. Graham R says:

    Hi! wicked script, exactly what i was looking for - i linked my profile to the theme template i’m building, i have the gallery loading, but it isn’t registering the clicks. Also, the layout is not coming up right in IE - i know i missed something stupidly small and was hoping someone here may spot it :P

    • admin says:

      Sorry for the delay Graham. The fault is mine. There was a bug in the script that I have corrected. Just download version 2.6.1. That should take care of everything for you.

  17. Please disregard my earlier comment :) Looked into your code and found a bunch of options. Problem solved.

  18. Hey there… nice one ! And very easy to setup and run.

    Question here: Is there any inbuilt option to start the gallery in non-slideshow mode? I’m trying to turn off the auto slideshow but haven’t met with any success so far :(

    Thanks,
    m^e

  19. BoGyesz says:

    After it was uploaded IE7 opened it without any problems, only when I opened it off-line gave me this warning message in spite it is not even Active X. Microsoft… :-D

    BTW it was extremely useful and easy to use. Thanks!

  20. BoGyesz says:

    This is great, very easy to implement! :-)
    Just one thing. When opening the page with IE7 it complains about Active X and doesn’t show the gallery automatically.
    How can I fix this?
    FF plays it without any problems but 75% of my site visitors use IE.

    • admin says:

      Bogyesz,
      I hate to say it, but I have to assume you’re mistaken. PikaChoose is entirely javascript and uses no Active X. I checked in IE7 and IE6 and it works without issue.

      If you have a URL I could look at, I’ll let you know if I see the same thing.

  21. Johnny says:

    This gallery looks great! Nice job. Is it possible to place the row of thumbnails above the main picture? Any suggestions on how to customize Pikachoose? Thanks!

    • admin says:

      You may be able to apply a negative position to the UL element. Though if the user isn’t using javascript it would probably make your layout look a little strange.

  22. I just used this on an website I was helping out with and it worked great. I was having a lot of trouble with another gallery so with this being so easy to implement was excellent. Thanks!

  23. Abe says:

    This looks brilliantly simple.. I just have one question. What about portrait(vertical) photos? I will download, play around, and see what happens.

    • admin says:

      You should have no trouble doing vertical photos. Just make sure to set the height and width of the thumbnails.

  24. koda says:

    when it comes to the end, how to go back?

  25. Great Job

  26. Timo says:

    Hi. Looks great! Could you write a short “How-to” guide how to implement and how to customize?

    Thank You!
    /timo

    • admin says:

      I’ll look into it. I’ve had a couple request for this. I’ll let you know if I create one.

  27. Cara Jo says:

    I think your pikachoose is great! I love the new updates!

  28. jimchen says:

    Very Good.

  29. admin says:

    Cj,
    Absolutely. Just make sure the two lists have separate IDs and run the PikaChoose function on both!

  30. CJ says:

    Can you have 2 galleries on one page?

  31. admin says:

    Suleiman,
    Currently this isn’t possible. I’m looking at changing the way captions are handle as they are not visible if the user does not have Javascript enabled. I’ll be looking at this soon and will let you know when I find a solution.

  32. suleiman says:

    I think this script is excellent, but I have one complaint:

    What if I want to add a hyperlink to the text that appears in the caption? There doesn’t appear to be a way to do that with the current plugin, since it extracts the caption text from the title tag of the image.

    Any ideas how I could go about doing so?

  33. Thanks for sharing this wonderful image gallery script. I’m currently redesigning my site to get away from Flash, and this is great because it has the fanciness of Flash but the accessibility of html. Kudos :)
    Josh

  34. a hassan says:

    hi,

    i’ve found your great application on jquery.com and i like it.

    i think its a simple design.

    you should show users how they can implement your application on their site.

  35. admin says:

    Welcome to the new PikaChoose.com! As always I love to know if you are using PikaChoose! Post your url here (just let me know if you don’t want it posted, all posts with urls have to be approved first!).

1 2 3 ... 5

Leave a Reply