Vanilla 2

realtime44

Hi guys,
This is awesome!! Thank you! Merci! My question has to do with calling the functions from html.
I've called attempted to use [a onclick="prettyGalleryPrevious()"][img ... ][/a]
and [a onclick="prettyGalleryNext()"][img...][/a] (where [] brackets replace <>)but it doesn't seem to work. If I use the navigation provided it works great!

How do I call the functions to scroll the images from an anchor?

Thanks!
RealTime

scaron

Hmmm

I'd have to dust off the code because it's been a while since I played with it.

I don't think the gallery navigations are publicly exposed.

One thing you could do is
$('.pg_next a').trigger('click');
$('.pg_previous a').trigger('click');

This will call all the click events on the button.

Thanks

realtime44

Thanks Stephane, I'll give that a try!

bruce

scaron,

Can you please elaborate. I want to have an image trigger the next and previous. How would I code these?

Thanks!

bruce

The forum rendered my html instead of displaying the code. I basically want to know what goes into the href="#" of an anchor tag to trigger the previous/next functionality.

bruce

I got the solution for creating your own previous/next navigation using images and html links instead of the standard arrows and paging.

1. For the next button, put the following as your href in the link: href="javascript: $('.pg_next a').trigger('click');"
2. For the previous button, use href="javascript: $('.pg_previous a').trigger('click');"

If you want to hide the default arrows and paging, open prettyGallery.css and add visibility:hidden; to each of the following classes:
1) .pg_paging .pg_previous {
2) .pg_paging .pg_next {
Stop here if you want to remove just the arrows but keep the page numbers, or continue to remove the paging as well.
3) .pg_paging .pg_next:hover {
4) .pg_paging li {

bruce

Just noticed that the next/previous link only works in chrome, not IE or firefox. I'm sure it's a simple syntax but I'm not a javascript expert. Anyone have ideas?

bruce

OK. Hopefully the final answer... hope this helps others looking for a similar solution.

Your link tag should have # as the href and the js in an onclick event like this:
href="#" onclick="$('.pg_next a').trigger('click');"
and
href="#" onclick="$('.pg_previous a').trigger('click');"

naumanikram

am using IE 8, and want to hide paging with Next Previous links as am successfully using next prev images.
I tried to used Visibility:hidden in the above mentioned posts but invain.
Any idea to remove such links.

merlin

Hi, I tried doing the above what you had suggested. The problem is I am having the prettyGallery in a datalist and now when click on the next image, even the gallery in the other rows of the datalist moves. How to write in such a way that each click is dedicated to each gallery. Please help.

Vanilla 2

Howdy, Stranger!

Categories