我有一张图片，我只是想通过单击图片上的任意位置将其拉伸(stretch)到全屏。所以，我将图像作为 DIV 的背景。我在使用 javascript 时遇到了问题:特别是针对 CSS。请使用 jsfiddle 告诉我。
这是我目前的尝试:http://jsfiddle.net/Muimi/hSzq7/
$(document).ready(function (){
$('.beforeClick').click(function (){
$('.beforeClick').css(div#stretch'width',"33fpx");
$(this).css(div#stretch'width',"100%");
});
});
div#stretch{
height: 334px;
width: 640px;
background-image: url(http://i.investopedia.com/inv/articles/slideshow/6-generic-products/generic-just-as-good.jpg);
}
<body>
<div id="stretch"></div>
</body>
最佳答案
$('#stretch').click(function() {
$(this).toggleClass('fullscreen');
});
CSS
html, body {
height: 100%;
min-height: 100%;
}
div#stretch{
height: 334px;
width: 640px;
background-image: url(http://i.investopedia.com/inv/articles/slideshow/6-generic-products/generic-just-as-good.jpg);
}
div#stretch.fullscreen {
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
关于javascript - 单击按钮后如何将 DIV 拉伸(stretch)到全屏？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18464554/