0

我正在尝试调整 html 页面的大小（现在只是垂直）。我正在使用 jquery 来执行此操作。我能够成功调整大小。但是根据图像，我会看到垂直条或水平条（即使图像适合）。我怎样才能避免这个垂直和水平条？任何人都知道为什么会发生这种情况，我该如何删除它？

我的 html 代码看起来像这样。

为了测试这一点，在你的文件夹中添加一些图像（将图像重命名为 image.png）以及这个 html 代码。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src= "http://code.jquery.com/jquery-1.7.1.min.js">
</script>
<script>
var doc_height;
function initial_stage(){
$("#check").css({
"transform-origin":"0 0", "-ms-transform-origin":"0 0","-webkit-transform-origin":"0   0","-moz-transform-origin":"0 0","-o-transform-origin":"0 0"});

}
function scaleStage()
{
var parentHeight = $(window).height(); 
var rescale= (parentHeight/doc_height)*.9;
$("#check").css('transform', 'scale(' + rescale + ')'); 
$("#check").css( '-o-transform', 'scale(' + rescale + ')');
$("#check").css('-ms-transform', 'scale(' + rescale + ')');
$("#check").css('-webkit-transform', 'scale(' + rescale + ')');
$("#check").css('-moz-transform', 'scale(' + rescale + ')');
$("#check").css('-o-transform', 'scale(' + rescale + ')');

}

$(window).on('resize', function(){ 

scaleStage(); 
});

// Make it happen when the page first loads
$(window).load(function(){
 doc_height=$(document).height();
 initial_stage();
 scaleStage();
 });

</script>
</head>
<body id="check">

 <h2>Norwegian Mountain Trip</h2>
 <img border="0" src="image.png" alt="Pulpit rock" >

 </body>
 </html>
4

1 回答 1

2

如果您指的是溢出，只需强制它们隐藏：

.cssclass {
    overflow-y: hidden;
    overflow-x: hidden;
}

到包含图像的 div。

更多提示：http: //www.w3schools.com/cssref/css3_pr_overflow-x.asp

<div class="cssclass">
  <img border="0" src="image.png" alt="Pulpit rock" >
</div>
于 2013-05-07T22:27:36.233 回答