个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
26
4
http://jsbin.com/exUmaFU/1/edit
在众多应用程序中，我喜欢 Windows 8，而我最喜欢的应用程序之一是天气应用程序。今天我想尝试制作“水平页面内容”，如下面的屏幕截图中的天气应用程序所示。
我曾尝试使用 DIV 来执行此操作，但没有任何运气。我尝试了各种方法，无论我尝试使用百分比，但都没有用。我恢复了对表格使用 em 并得到了我想要的效果，但现在我的问题是让 div 的宽度至少占页面宽度的 90%。
对于如何实现这种效果，我们将不胜感激。
简化代码:
<!DOCTYPE html>
<html>
<head>
<title>Win 8 Horizontal Content Experiment</title>
<meta charset='utf-8'>
<meta content='width=device-width, height=device-height, minimum-scale=1.0, maximum-scale=1.0' name='viewport'>
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css'>
<script src='http://code.jquery.com/jquery-1.9.1.min.js' type='text/javascript'></script>
<script src='http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js' type='text/javascript'></script>
<style type="text/css">
body {
background: #000;
}
#contain {
display: inline-block;
position: absolute;
width: 100%;
height: 100%;
overflow-y: hidden;
overflow-x: scroll;
}
#contain table {
height: 100%;
}
#contain td {
width: 100%;
height: 100%;
border: 0px;
padding: 0px;
margin: 0px;
}
/* Separate DIVS Inside Container */
#contain .box {
display: inline-block;
width: 80em;
height: 100%;
background: red;
color: #700;
}
</style>
</head>
<body>
<div id="contain">
<table>
<tr>
<td>
<div class="box">
<center><h1>Page 1</h1></center>
</div>
</td>
<td>
<div class="box">
<center><h1>Page 2</h1></center>
</div>
</td>
<td>
<div class="box">
<center><h1>Page 3</h1></center>
</div>
</td>
<td>
<div class="box">
<center><h1>Page 4</h1></center>
</div>
</td>
<td>
<div class="box">
<center><h1>Page 5</h1></center>
</div>
</td>
<td>
<div class="box">
<center><h1>Page 6</h1></center>
</div>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
(function() {
function scrollMenu(e) {
e = window.event || e;
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
document.getElementById('contain').scrollLeft -= (delta*40); // Multiplied by 40
e.preventDefault();
}
if (document.getElementById('contain').addEventListener) {
// IE9, Chrome, Safari, Opera
document.getElementById('contain').addEventListener("mousewheel", scrollMenu, false);
// Firefox
document.getElementById('contain').addEventListener("DOMMouseScroll", scrollMenu, false);
} else {
// IE 6/7/8
document.getElementById('contain').attachEvent("onmousewheel", scrollMenu);
}
})();
</script>
</body>
</html>
最佳答案
不要使用表格。使用 inline-block div 和 width: 100% 和 height: 100% inside div with position: relative, white-space: nowrap(这将使框保持在一行中)以及 width:100% 和 height:100%。确保你定义了 html, body {width: 100%; height: 100%} 在你的样式中。我用我认为你想做的事情创建了一个 jsfiddle。
关于javascript - Windows 8 水平内容页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18871453/
26
4
0
为什么我可以在控制台 window.window.window.window 中执行此操作并无限追加 .window 并返回 DOM 窗口？ 最佳答案 因为 window 对象有一个指向它自身的 wi
Windows管理员用户和系统用户之间有什么权限区别吗？ 有些时候，我必须将 cmd 窗口提升到系统权限才能删除一些文件。这可能是因为系统用户锁定了文件，或者系统用户可能具有更高的访问权限，我希望找出
按照目前的情况，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the
Windows 服务和 Windows 进程之间的区别是什么？ 最佳答案 服务是真正的 Windows 进程，没有区别。服务的唯一特殊之处在于它由操作系统启动并在单独的 session 中运行。一个独
我有一个 Windows 网络 (peer-2-peer) 以及 Active Directory，我需要记录向服务器发送任何类型打印的用户的名称。我想编写一个程序来记录他们的用户名和/或他们各自的
当我让一个 Windows 服务尝试安装另一个 Windows 服务时遇到问题。 具体来说，我有一个 TeamCity 代理在 Windows 2008 AWS 实例上为我运行测试。这些测试是用 Ja
我创建了一个应用程序来接收广播的 Windows 消息，效果很好。当我把它变成一个服务、安装它并启动服务时，该服务没有收到消息。 最佳答案 服务可能必须被授予访问桌面的权限。从服务属性、“登录”选项卡
我正在使用 Delphi 2010 编写应用程序。我希望在 Windows 启动时启动我的应用程序。我需要它在最新版本的 Windows XP、7.0 和最新的服务器中工作。 将其存储在以下关键工作下
我想开发一个适用于所有三个版本的 Windows XP、Vista 和 7 的应用程序。该应用程序允许人们选择要打开的文件，并允许他们在某些操作后保存文件。三个版本的 Windows 中的每一个都有不
对于\Windows\中的文件类型与\Windows\System32 中的文件类型是否有标准约定？ 我正在开发一个 SDK，其中包含各种 DLL、帮助程序 exe 和 Windows 服务 exe。
要求是，必须在 WINDOWS7 机器上配置自动登录，但是这个自动登录应该等待(即延迟)直到另一个 Windows 服务发出继续自动登录的信号。 我使用了自定义凭据提供程序，它在其中等待另一个 Win
很抱歉，这不是一个大问题，而是更多的帮助人们解决这些特定问题的方法。我正在解决的问题要求使用串行I/O，但主要在Windows CE 6.0下运行。但是，最近有人问我是否也可以在Windows下运行该
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 这个问题似乎不是关于 a specific programming problem, a softwar
不幸的是 SC 命令在 W2000 上还不可用，所以我不能使用它。 我正在尝试检查服务是否在 W2000 服务器上运行，如果它没有运行，脚本应该能够启动该服务。 如何在 Windows 2000 上执
如何在登录到 Windows 之前启动 Windows 窗体应用程序？是否可以在登录到 Windows 之前启动 Windows 窗体应用程序？如果不是，我是否有机会在登录前启动 Windows 服务
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 这个问题似乎不是关于 a specific programming problem, a softwar
我想在 XML 文件中区分 Windows XP 和 Windows 7。我想我会在 XML 中为它使用一个环境变量。 但是我找不到在 Windows 中定义的任何系统环境变量来提供此信息。 我看到了
有谁知道我可以在注册表中的哪个位置检查机器上是否安装了这些应用程序: Windows 通讯录 Windows 联系人 最佳答案 来自 Microsoft:我知道它说的是 win 95，但 reg 是一
我正在尝试从我的 Windows 服务器调用放置在远程 Windows 服务器上的批处理文件。我在远程服务器上安装了 freeSSHd。我尝试使用 putty/plink 但没有结果。 我使用的命令语
( 大家好。我是 Windows 编程的新手，所以如果已经有人问过我，我提前道歉，我只是不知道要搜索什么，但这个问题一直让我发疯，我知道有人可能真的很容易回答这个问题。) 我的公司有一个在 Windo
我是一名优秀的程序员,十分优秀！