Search code examples
fancyboxfancybox-3

Moving Fancybox navigation into or next to toolbar

Is there an easy way to move the Fancybox navigation arrows into or next to the toolbar? Ideally, I would like to have them all above my gallery items with the left arrow, then the right arrow, then the close button. I can figure out how to reposition everything using CSS, but I was wondering if there was a quicker/easier way to get the layout I want. Thanks!

Solution

  • Simply use buttons option to specify what buttons and in what order you need:

    $('[data-fancybox="images"]').fancybox({
  buttons: ['arrowLeft', 'arrowRight', 'close']
})

    https://codepen.io/anon/pen/jjYOLj?editors=1010