custom prev/next arrow buttons

1,166 views
Skip to first unread message

daniel

unread,
May 23, 2012, 6:31:14 PM5/23/12
to fancybox
I would like to know the answer of this post...
In addition to moving to the next image I would like to manipulate
some js variable to control the targeted links
I have something like this:

<a id="hiddenclicker1" class="overlay" rel="gallery" href="#" >Hidden
Clicker</a>
<input type="text" style="text-align: center" maxlength="6" id="page"
name="n_page" />

var j1 = document.getElementById("hiddenclicker1");
var page_elem = document.getElementById("page");
var page_value = page_elem.value;

var page_prev = page_value -1;
var page_next = page_value +1;

j1.href = my_href+page_value;

$('#hiddenclicker1').trigger('click');

this allow me to display the page I entered in the textbox and move by
one step only to the next and previous pages by clicking the nav
arrows.

lets say the user pressed the previous button arrow
What I wanna do before displaying the previous page in the fancybox is
reset
page_value to page_prev and onclick on the arrow button relauch

j1.href = my_href+page_value;

$('#hiddenclicker1').trigger('click');

thank you very much
Daniel

JFK

unread,
May 23, 2012, 8:15:55 PM5/23/12
to fancybox
your best bet would be to hide the default navigation arrows and add
your own custom navigation where you can manipulate the javascript.

I published and example here
http://stackoverflow.com/a/8440744/1055987

that example adds the navigation within the title
I guess you can add your custom functionality within the onclick
attribute
Reply all
Reply to author
Forward
0 new messages