Vimpil Vimpil - 3 months ago 8
CSS Question

Fancybox left and right arrow button on the right-bottom of sliding picture

Just trying to figure out how to change options of fancybox buttons to snap them on the right bottom corner of sliding images.

fancybox template example http://fiddle.jshell.net/t91p3g7s/?utm_source=website&utm_medium=embed&utm_campaign=t91p3g7s

arrows position that i want to achieve:
buttons right-bottom corner

Answer

You can force on CSS. It's simple.

Just add this css:

.fancybox-next {
    bottom: 10px;
    top: auto;
    width: 30px;
    height: 30px;
}
.fancybox-prev {
    bottom: 10px;
    top: auto;
    width: 30px;
    height: 30px;
    right: 60px;
    left: auto;
}
.fancybox-next span, .fancybox-prev span{
    visibility: visible !important;
    display: block !important;
}

Or Just click here.

http://fiddle.jshell.net/t91p3g7s/6/

:)