Can Fancybox be responsive only horizontally for tall content?

旧时模样 提交于 2019-12-17 06:18:10

问题


I have a site with some very tall images. I'd like for these images to respond in a responsive way horizontally, but not vertically. If they conform to the height of the browser, they become too small to see properly.

Is there a simple way to accomplish this that I'm missing?

See an example below. Click on the second thumbnail "bswift", then a small grey square to launch Fancybox. http://www.eaaronrossdesign.com/index2.php


回答1:


Try combining the fitToView and maxWidth API options like :

$('.thumbs_small').fancybox({
    openEffect: 'elastic',
    closeEffect: 'elastic',
    prevEffect: 'fade',
    nextEffect: 'fade',
    fitToView: false, // images won't be scaled to fit to browser's height
    maxWidth: "90%" // images won't exceed the browser's width
});

Check JSFIDDLE



来源:https://stackoverflow.com/questions/17244157/can-fancybox-be-responsive-only-horizontally-for-tall-content

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!