Question

首先，我是新手，所以请耐心等待。

我已经对my site.

实施了一个非常酷的'滚动脚本淡出'

但是，我要做的是让图像位于顶部100％宽度，如fastcocreate's网站。

这是我正在使用的div：

<div class="home" style="background-image: url(http://payload51.cargocollective.com/1/7/237315/3336908/HomeImage_o.jpg); background-attachment: fixed; height: 560px; width: 100%; opacity: 1; background-position-y: 0px; background-position-x: center; background-repeat: no-repeat no-repeat; background-size: 100% 560px;"> 
</div>

现在我尝试添加'background-size：100％auto;'对于诀窍的div，除了这对我的文本做了奇怪的事情。例如，如果我使浏览器更加苗条，文本就不会随之移动 - 所以我放弃了这个想法。

接下来我将其更改为'background-size：100％560px;'这解决了这个问题。但另外一个问题是当你使浏览器变小时图像会变窄，或者当我使浏览器变宽时图像会拉伸。

我觉得我与上面的那个更接近，但我正在寻找拉伸图像问题的解决方案。我是否需要上传大于当前尺寸的图片？

正如我之前所说，these guys做得很好。

Answer 1

看起来fastocreate的最小宽度设置为他们的图像，你试过

min-width: 100%;
height: auto;

我非常确定fastocreate会做什么

最好的， -b

*另外，尝试在浏览器上启用“检查元素”。当试图反映某人的风格时，它非常有用。

编辑：

在回复你的评论时，你可以尝试制作一个可以调整它的jQuery函数。

例如

function resize(){
  var height = $('img').width / 2; //sets variable height to the width divided by 2
  $('img').height(height); // sets the value of the height to the variable height
};

或类似的东西。

确保div是100％宽度，不会破坏菜单

1 个答案: