Can you make fancyBox ignore title text when sizin

2019-06-04 17:53发布

问题:

I'm using fancyBox 2.1.5 and displaying media with multi-line titles below them.

My problem is that fancyBox seems to be shrinking media in an attempt to fit long titles on-screen. Below I've attached screenshots from my iPhone, where it is most obvious.

Here the image is displayed at full size because I've removed the title:

Here the image is shrunken, trying to account for the long title:

I'd like fancyBox to ignore the title text when sizing media and always show it at full size, as seen in the first image. I'm OK with having to scroll to read all the title text.

Thanks for any help!

回答1:

If you are OK with having to scroll to read all the title text, then you can combine the fitToView and maxWidth options to have the size of your media the way you want it without ignoring the title like :

$(".fancybox").fancybox({
    fitToView: false, // avoids media to shrink to fit in the viewport
    margin: [20, 60, 20, 60],
    maxWidth: "90%", // avoids bigger media to stretch outside the viewport boundaries 
    helpers: {
        title: {
            type: "inside"
        }
    }
});

See JSFIDDLE