1

I've created two image galleries at http://www.spanish-bookworld.com/fancybox_demo.html

The lack of "Next" button on the image when the mouse is not over it worries me. My audience is very computer illiterate and most of them will not see that there are more images in the gallery.

I reckon I have two options. One is to have a Next button permanently on the images, and the other one is to have a slideshow.

Unfortunately I can't figure out how to code either solution.

Any clues? Thanks.

Maria
  • 31
  • 2
  • 8
  • http://stackoverflow.com/a/8672001/1055987 – JFK Sep 16 '13 at 16:56
  • possible duplicate of [Fancybox 2 visible navigation arrows](http://stackoverflow.com/questions/8670956/fancybox-2-visible-navigation-arrows) – JFK Sep 16 '13 at 16:57

1 Answers1

1

As the fancybox documentation states in their button example (http://jsfiddle.net/Xh3B2/), you should try to set the CSS on fancybox navigaton to visible (and then set their position with CSS).

For your example, you should use this kind of CSS first to set the navigation always visible and then set the next/previous button position.

.fancybox-nav {
width: 60px;       
}
.fancybox-nav span {
visibility: visible;
opacity: 0.5;
} 
.fancybox-nav:hover span {
opacity: 1;
}
.fancybox-next {
right: -60px;
}
.fancybox-prev {
left: -60px;
}

For the slideshow option, you should set your fancybox script to "autoPlay = true. The default value is set to "false" which make the slideshow disabled.

Maikeximu
  • 318
  • 1
  • 3
  • 10
  • I've now got the Next and Back button permanently visible. I've achieved that by changing only the visibility value in this code from the .css file. All other values are unchanged: .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: visible; } Is that the right way of doing it? It works well. – Maria Sep 16 '13 at 13:06
  • Yeah it seems to work. The nav span are useful to set new position (let's say outside your lightbox) for the two buttons (they can sometimes hide your content so by putting them outside of the box, you can gain visibility. :) – Maikeximu Sep 16 '13 at 13:21