Question

我在drupal工作..我使用jquery制作了一个幻灯片，但图像在不同的浏览器中显示不同的大小。是否可以在％

中设置宽度和高度

<script src="http://test/sites/js/jqFancyTransitions.1.8.min.js" type="text/javascript"></script>
<script>
$('#ft').jqFancyTransitions({
    effect: 'zipper', // wave, zipper, curtain
    width: 682, // width of panel
    height: 268, // height of panel
    strips: 20, // number of strips
    delay: 2500, // 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
    navigation: false, // prev and next navigation buttons
    links: false // show images as links
});

Answer 1

试试这个

width : screen.width * (desired percentage/100),
height: screen.height * (dsired percentage/100),

Answer 2

我看不到你可以直接在插件代码中，但你可以省略宽度和高度线，并使用CSS来设置样式表中相关图像的样式，并将尺寸设置为百分比

Answer 3

// set panel
        $('#'+el.id).css({
            'background-image':'url('+img[el.id][0]+')',
            'width': params.width,
            'height': params.height,
            'position': 'relative',
            'background-position': 'top left'
            });

例如：

// set panel
        $('#'+el.id).css({
            'background-image':'url('+img[el.id][0]+')',
            'width': a%,
            'height': b%,
            'position': 'relative',
            'background-position': 'top left'
            });

这是来自jqFancyTransitions.1.8.js

的相关代码

您可以尝试将params.width和params.height值替换为百分比，而不是全部，而是在//set panel下，在参数上分配css。但是这两个变量也用在代码中的其他地方。除非你尝试，否则你可能永远不会知道它们会产生什么影响。

Answer 4

我不知道如何更改为% width & height会使您的图片在不同浏览器上的大小相同。

在width & height中定义px是在所有浏览器中保持相同大小的最佳选择。

但是如果你真的想要，你应该修改那些函数参数并设置如下：

   $.....
   $width: '80%', // width of panel
   $height: '60%', // height of panel
   $.....

是否可以在jquery幻灯片中设置％的宽度和高度

4 个答案: