当前位置：文江博客话题详情

Chrome 中的 iframe 中删除垂直滚动条，保留水平滚动条

发布于 2024-09-27 12:31:03 字数 239 浏览 5 评论 0原文

我有一个 iframe，我想为其启用水平滚动条，但禁用垂直滚动条。

我的 iframe 样式如下：overflow-y:hidden; Overflow-x:auto;

这在 FireFox 中工作得很好，但在 Chrome 中却不行。有什么解决方法可以让它在 Chrome 中工作吗？

更新： 我已经转而使用带有溢出的表格单元格，而不是 iframe。我不知道这是否会让垂直滚动变得更容易或更困难。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

开始看清了 2024-10-04 12:31:03

答案实际上在这里：

Safari/Chrome (Webkit) - 无法隐藏 iframe 垂直滚动条

祝你好运！！

回复收藏 0 原文

桜花祭 2024-10-04 12:31:03

这在任何浏览器中都适用

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> 
<title>Untitled 1</title> 
</head> 
<style type="text/css"> 
#test iframe { 
width: 100%; 
height: 100%; 
border: none; } 

#test { 
width: 100%; 
height: 3530px; 
padding: 0; 
overflow: hidden; } 

</style> 

<body style="margin:0;"> 
<div id="test"> 
<iframe src="http://stackoverflow.com/" scrolling="no">
</iframe> 
</div> 
</body> 
</html>

This works well in any browser

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> 
<title>Untitled 1</title> 
</head> 
<style type="text/css"> 
#test iframe { 
width: 100%; 
height: 100%; 
border: none; } 

#test { 
width: 100%; 
height: 3530px; 
padding: 0; 
overflow: hidden; } 

</style> 

<body style="margin:0;"> 
<div id="test"> 
<iframe src="http://stackoverflow.com/" scrolling="no">
</iframe> 
</div> 
</body> 
</html>

回复收藏 0 原文

找回味觉 2024-10-04 12:31:03

如果找不到其他内容：

将 iframe 的高度设置为 =>103%

请参阅此处：

http://forums.aspfree.com/web-layout-43/horizontal-scrollbar-iframe-removing-23237-2.html

这是解决方法可能会起作用...

你告诉我！

祝你好运

回复收藏 0 原文

情话已封尘 2024-10-04 12:31:03

将父 div 元素添加到 iframe 中，如下所示：

<div style='overflow: hidden; width: 600px; height: 400px;'>
    <iframe src='http://www.website.com/index.html' style='overflow-y: hidden;' width='580' height='400' frameborder='0' seamless='seamless'></iframe>
</div>

它将隐藏垂直滚动条，但用户仍然可以使用“向上翻页”、“向下翻页”和箭头键< /strong> 垂直滚动选项。

Add parent div element to iframe like this:

<div style='overflow: hidden; width: 600px; height: 400px;'>
    <iframe src='http://www.website.com/index.html' style='overflow-y: hidden;' width='580' height='400' frameborder='0' seamless='seamless'></iframe>
</div>

It will hide vertical scroll bar but user could still use 'page up', 'page down' and arrow keys options for vertical scrolling.

回复收藏 0 原文

~没有更多了~