Question

我想将flux slider用于我正在构建的网站...一切正常，但我无法更改图像大小...我尝试过以下jquery

$(function(){

if(!flux.browser.supportsTransitions)
 alert("Flux Slider requires a browser that supports CSS3 transitions");

window.f = new flux.slider('#slider', {
pagination: true,
width: 300,
height: 300,
transitions: ['bars3d']

});

});

但是这会将图像裁剪为我指定缩放的尺寸有什么办法吗？请帮忙。

Answer 1

将高度更改为0并将宽度设置为负值应该这样做。

$(function(){
    if(!flux.browser.supportsTransitions)
        alert("Flux Slider requires a browser that supports CSS3 transitions");
    window.f = new flux.slider('#slider', {
        pagination: true,
        width: -300,
        height: 0,
        transitions: ['bars3d']
    });
});

Answer 2

有三个可能的问题（不确定，因为你没有添加html / css r小提琴）;

1）您正在调整图像容器的大小，因为您已将height和width设置为图像，例如<img src="blahblah.jgp" height="900" width="500" />删除height/width将解决问题。

2）其次，检查你是否有一些css没有使js覆盖，即你正在使用!important图像css（高度/宽度）应用于图像。

3）最后但并非最不重要的是，另外尝试将图像容器height/width设置为您正在执行的js，这将使图像自动适合其容器。

img{
    max-width: 100% !important;
    height:auto 100% !important;
    display:block 100% !important;
}

同时尝试添加！重要的是你的js。希望他们中的任何一个都适合你。

祝你好运

如何使用焊剂滑块更改图像尺寸

2 个答案: