个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
24
4
我想知道，为什么按了TAB key在屏幕上显示包含可聚焦元素(输入、超链接)的负边距右( margin-right:-170px )的 div 容器？有什么想法吗？
在我的例子中，我需要防止这种行为，因为我有侧边栏菜单(在屏幕外)，它会在用户多次按下标签按钮后显示。它不应该。我只想在移动设备和平板设备上显示此侧边栏。
注:更重要的是。 Firefox 中的行为不同和Google Chrome不同.在我的示例中，如果您删除 <input>元素并仅保留超链接 <a> , 按 tab 键后不会显示该框。在 Chrome 中它会。
类似帖子: Chrome bug? or how do I prevent a form field to SCROLL the container when focused?
解决方案之一(防止TAB):可能会解决问题，但不推荐。
$("body").on("keydown", function (e) {
if (e && e.keyCode === 9) {
console.log('Tab was pressed', e);
e.preventDefault();
}
});
>> 截图中的工作示例:
.box {
width: 150px;
height: 50px;
display: block;
right: 0;
margin-right:-170px; /* Negative margin to set container off the screen*/
padding:10px;
background: #292929;
color: #fff;
position: absolute;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
box-shadow:2px 2px 5px rgba(0, 0, 0, .4)
}
.box.input {
top: 0;
}
.box.hyperlink {
top: 100px;
}
body {
background: lightgray;
}
a {
color: white;
}
input {
margin:10px 15px;
}
p {
width:400px;
}<p>After you press TAB key, box containing input will appear from the right on the screen.... but why?</p>
<div class="box input">
<label>Custom Input 1</label>
<input type="text" placeholder="some input" />
</div>
<div class="box hyperlink">
<label>Custom hyperlink</label>
<a href="http://www.apple.com" target="_blank">Some link</a>
</div>>> 工作示例#2
最佳答案
正在设置您的 .box至 fixed而不是 absolute防止行为。
.box {
/* ... */
position: fixed; /* position the element relative to the viewport */
/* ... */
}
我假设是因为浏览器无法滚动“超出视口(viewport)”。如果您打算将元素放置在屏幕之外，这也是更直观的语义。
如果侧边栏仅适用于小型设备，我同意这样的观点，即在其他设备上根本不显示它会更干净。例如
@media all and (min-width: 769px) { /* determining the correct size is up to you */
.box {
display: none;
}
}
但请注意，视口(viewport)实际上并不是检测“小型设备”的非常可靠的方法
盒子放在你的<body>里面它扩展以容纳内容(通过水平滚动条显而易见)。当按 Tab 键时，焦点会转到 <input> ，浏览器将焦点元素滚动到 View 中。所以实际上不是盒子而是整个元素内容向左移动。从技术上讲 scrollLeft包含节点的属性(在您的情况下为 <body>)设置为使输入在屏幕上可见。
这是从 Chromium 的 Angular 来看，更精细的实现细节可能因浏览器而异。
关于html - 为什么按 TAB 键(:focus effect) causes positioned off-the-screen <div> element with <input> field inside it to appear on the screen?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33995888/
24
4
0
我在 * nix 中相当新。有没有办法创建一个屏幕，它会立即执行给定的命令序列(带有自己的参数)？两个小时的谷歌搜索一无所获——也许是因为我不能 清楚地陈述问题。 我希望像 screen -dmS n
我顺风顺风margin配置文件中的属性: module.exports = { theme: { extend: { 'margin': {
我正在 cygwin 环境中配置 GNU 屏幕。实际上重新配置——它之前总是有效，当我升级到 cygwin-64 时，相同的配置文件给了我意想不到的行为。 发生的情况是，每当我在终端中执行溢出全屏的操
关闭。这个问题是off-topic .它目前不接受答案。 想改善这个问题吗？ Update the question所以它是 on-topic对于堆栈溢出。 10年前关闭。 Improve this
我想使用 GNU screen 来监视这样的串行 USB 端口: $ screen /dev/ttyUSB0 115200 但我需要调整一些终端线路设置。我已经进行了几次尝试，但似乎都没有奏效。例如，
我需要在我的 .screenrc 中放入什么才能创建嵌套 session (即:屏幕中的屏幕)？ 目前，如果我运行 screen再次从打开的屏幕选项卡中，而不是在该选项卡中打开一个新的屏幕 sessi
我通常像这样使用 gnu 屏幕: 1. 为我的所有任务启动一个屏幕 session 2.当我登录到一台机器时，我连接到我同事制作的屏幕 session (screen -x)(因此这使它成为“内部屏幕
使用屏幕，我知道我可以按名称命名和重新附加到 session : screen -S screen -r 当我执行 screen -ls我得到一个 session 列表，但
如何增加screen中可以查看的行数？ 我想查看从运行screen -S 到当前操作的那几行。例如，如何将缓冲区长度增加到大约50000行？ 我已经尝试过^a :scrollback ，但是它不会增加
很难说出这里问的是什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或言辞激烈，无法以目前的形式合理回答。如需帮助澄清此问题以便可以重新打开，visit the help center . 8年前关闭
作为设置桌面的启动脚本的一部分，我初始化了一个带有多个窗口的 screen 。为此，我启动一个守护进程并向其发送 -X screen 和 -X stuff 命令，最后使用 -r 重新连接。 不幸的是，
当我开始时 screen ，我收到以下消息: Screen version 4.00.03jw4 (FAU) 2-May-06 Copyright (c) 1993-2002 Juergen Weig
刚刚开始使用 Screen 与 Vim 进行远程配对编程。 想知道是否有办法调整窗口大小，因为我们的终端空间在默认设置下非常有限。 目前我正在进入这样的屏幕: User 1: screen -R te
所以我一直在尝试寻找一些关于 GNU screen 实际上如何在 high 下工作的信息，而不必真正阅读源代码，但我一直无法这样做。 screen 做了什么，即使在终端 session 关闭时它也能保
我有一个游戏服务器。它通过 dotnet 在 linux 上运行。我在“screen ” session 中运行它。但是我正在努力重新启动此服务器。从外面看，很容易。我只是通过名称杀死现有 scree
我想使用 mac/linux 命令 screen 启动多个 screen ，让每个 screen 执行我的 .bashrc，然后从该 .bashrc 运行一系列别名/函数。我尝试在我的 .screen
当我在终端工作时，我会看到最后一个 shell 命令执行输出的历史记录。如果我运行 vim，我会看到我全屏打开的文件。当我退出 vim 时，我可以再次看到最后一个 shell 命令的历史。 但是，当我
我正在写一个小脚本，它确实向正在运行的屏幕 session 发送命令。此命令会停止屏幕，但不会立即停止。我需要等待它完成才能继续执行脚本的其余部分。 这就是我停止屏幕的方式: screen -S $S
我们在办公室经常使用 gnu screen ，有时如果我不注意，我最终会迷失在我已经在哪个 screen session 中。 所以我的问题是，你怎么知道你在哪个屏幕 session 中？你有办法查吗
我想知道 Mozenda Screen Scraper 是如何编码的？ http://www.mozenda.com/screen-scraper 我展示了一个浏览器，用户可以在其中选择他想要删除的字
我是一名优秀的程序员,十分优秀！