Question

我正在使用jquery幻灯片。我必须将宽度和高度更改为百分比值。

jquerytransitions.js包含以下代码

$.fn.jqFancyTransitions.defaults = {    
        width: 682, // width of panel
        height: 268, // height of panel
        strips: 10, // number of strips
        delay: 5000, // delay between images in ms
        stripDelay: 50, // delay beetwen strips in ms
        titleOpacity: 0.7, // opacity of title
        titleSpeed: 1000, // speed of title appereance in ms
        position: 'alternate', // top, bottom, alternate, curtain
        direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
        effect: '', // curtain, zipper, wave
        navigation: false, // prev next and buttons
        links : false // show images as links       
    };

})(jQuery);

我必须将宽度和高度调整为百分比......是否可能？

Answer 1

我唯一能想到的是手动计算：

var percentage = 25; //Your desired percentage
daddyWidth = $('#daddyElelement').width();
finalWidth = daddyWidth*percentage/100;

通过向“参数数组”添加更多元素来使您的脚本采用更多选项，最后您可以将这些元素放入而不是像素数

width: finalWidth , // width of panel

Answer 2

如果您希望宽度和高度相对于浏览器窗口，请使用：

...
width : window.innerWidth * (percentage/100),
height: window.innerHeight * (percentage/100),
...

或者如果你想要它相对于任何其他元素：

...
width : element.offsetWidth * (percentage/100),
height: element.offsetHeight * (percentage/100),
...

Answer 3

你可以尝试用

替换宽度：682，高度：268

width : screen.width * (47.45/100),
height: screen.height * (29.8/100),

将宽度和高度更改为jquery中的百分比

3 个答案: