如果有一种方法可以让所有图像全屏显示。
唯一随浏览器调整大小的图像是背景图像。其余图像是将鼠标悬停在列表项上时淡入淡出的图像。
body {
background: black;
width:100%;
height: 100%;
padding:0px;
margin:0px;
}
ul {
list-style:none;
background-color:#00F
}
div {
position:absolute;
z-index:0;
top:0;
left:0;
padding:0px;
margin:0px;
width:100%;
height:100%;
background: url(images/01.jpg);
}
container {
position:absolute;
z-index:1;
left:0;
right:0;
width:270px;
margin:0 0 0 10px;
}
<div id="content">
<div id="div"></div>
<div id="container">
<ul>
<li id="first">test</li>
<li id="second">test</li>
<li id="third">test</li>
</ul>
</div>
</div>
如果您将鼠标悬停在列表项上,淡入的图像也是需要调整大小的图像。用 jQuery 替换背景。
我希望有人能帮助我。
最佳答案
如果我很好理解你的问题,
添加到 CSS div 样式:
background-size: cover;
(或 background-size: contain;
取决于你想要什么)
关于jquery - 如何让所有图像全屏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7334282/