小编kae*_*asu的帖子

停止在可缩放的iframe上滚动

我正在开发一个网页,它嵌入来自iframe内不同域的其他网页.此页面的内容完全符合iframe,因此没有溢出的内容,也没有滚动条.但是,可以使用鼠标滚轮缩放内容.

但在Safari和Chrome中,使用鼠标滚轮进行缩放也会滚动整个页面.我不希望这种滚动发生 - 只是缩放iframe.当鼠标悬停在iframe上时,如何停止滚动?

我试图在JSFiddle的最小例子中重新创建问题:https://jsfiddle.net/twodee/57a68k3h .当我缩放绿色iframe时,文本会缩放,但页面也会滚动.

frame = document.getElementById('myframe');
frame_child = document.createElement('div');

var font_size = 12;
frame_child.addEventListener('wheel', function(e) {
  font_size += e.wheelDelta;
  frame_child.style.fontSize = font_size + 'px';
});

frame_child.style.width = '190px';
frame_child.style.height = '190px';
frame_child.innerHTML = 'this text should zoom';
frame.contentWindow.document.body.appendChild(frame_child);
Run Code Online (Sandbox Code Playgroud)
#myframe {
  background-color: #00FF00;
}
Run Code Online (Sandbox Code Playgroud)
<ul>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
  <li>a</li>
</ul>
<div>
  <iframe id="myframe" …
Run Code Online (Sandbox Code Playgroud)

html iframe

10
推荐指数
1
解决办法
910
查看次数

我们何时需要非持久性偏好?

在Android偏好设置方面,我试图围绕持久性.有一个持久的属性,可以是true或false.如果为true,则首选项将提交给共享首选项.如果偏好不持久,如何使用偏好?

android android-preferences

8
推荐指数
1
解决办法
1855
查看次数

CSS 网格中输入和标签的基线对齐

我正在尝试使用 CSS 网格布局构建一个表单。标签显示在左列中,输入显示在右列中。该align-items属性设置为baseline。在 Chrome 中,标签和输入的文本在其基线上垂直对齐。但在 Firefox v94 中,标签的位置高于输入中的文本。

这是该问题的最小可重现示例:

<!DOCTYPE html>
<html>
<head>
  <style>
.login-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 10px 2px;
  align-items: baseline;
}

label, input {
  font-size: 3em;
}
  </style>
</head>
<body>

  <div class="login-grid">
    <label>username</label>
    <input type="text">
  </div>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

此示例已在Codepen上发布。

当我将输入包装在 a 中时div,文本确实跨列对齐。我不想这样做,因为嵌套会影响尺寸。

我已经检查了许多关于对齐问题的其他帖子,但我没有找到与 CSS 网格相关的帖子。

css alignment baseline css-grid

6
推荐指数
1
解决办法
1155
查看次数