调整html页面大小jquery不带竖条
调整html页面大小jquery不带竖条
提问于 2013-05-08 06:24:58
我正在尝试调整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>回答 1
Stack Overflow用户
回答已采纳
发布于 2013-05-08 06:27:36
如果你指的是溢出，只需强制它们隐藏：
.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>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16429592
复制相关文章
相似问题
腾讯云开发者
