Question

有没有办法在JSFiddle中完全禁用滚动。

我试过了：

position: fixed;

和

overflow: hidden;

但是当我将结果嵌入我的网站时，我仍然可以滚动。我想知道是否有人有关于如何完全修复某些内容并且没有滚动功能的任何提示。

我目前的HTML和CSS：

＆＃13;

.hidden {
  visibility: collapse;
}
html,
body {
  height: fit;
  background: #e2dede;
  margin: 10px;
}
div {
  width: fit;
  overflow: hidden;
}
td + td {
  border-left: 1px solid #eee;
}
th {
  border-bottom: 1px solid #fff;
  background: #333333;
  color: #fff;
  padding: 5px 5px;
  font-family: "raleway";
  font-size: 14px;
}
td {
  border-bottom: 1px solid #eee;
  background: #e2dede;
  color: #000;
  padding: 5px 5px;
  font-family: "raleway";
  font-size: 13px
}

＆＃13;

<table class="tablesorter">
  <table>
    <thead>
      <th>Name</th>
      <th>Release Date</th>
    </thead>
    <tbody>
      <tr>
        <td>Peter Parker</td>
        <td>11/07/2015</td>
      </tr>
      <tr>
        <td>John Hood</td>
        <td>11/07/2015</td>
      </tr>
      <tr>
        <td>Clark Kent</td>
        <td>12/07/2015</td>
      </tr>
      <tr>
        <td>Bruce Almighty</td>
        <td>13/07/2015</td>
      </tr>
      <tr>
        <td>Bruce Evans</td>
        <td>14/07/2015</td>
      </tr>
    </tbody>
  </table>

＆＃13;

Answer 1

当您在网站上嵌入JSFiddle演示时，JSFiddle会在顶部添加一个“结果”栏，以添加一个链接以允许在JSFiddle中编辑演示。由于该栏和嵌套的iframe设置为与外框相同的高度，因此会显示一个滚动条（demo）。

<iframe height="300" width="100%" src="http://jsfiddle.net/5sadgev6/embedded/result,html,css" allowfullscreen="allowfullscreen" frameborder="0">

  <div id="wrapper">
    <div id="head">
      <h1><a title="Edit in JSFiddle" href="/5sadgev6/light/" target="new">Edit in JSFiddle</a></h1>
      <div id="actions" class="">
        ...
      </div>
    </div>

    <div id="tabs" style="height: 298px;">
      <div class="tCont result active" id="result">
        <iframe style="height: 300px;" src="//fiddle.jshell.net/5sadgev6/show/light/" sandbox="allow-forms allow-popups allow-scripts allow-same-origin"></iframe>
      </div>

      ...

    </div>
  </div>

</iframe>

在上面的HTML中查看JSFiddle添加的高度设置。

基本上，你不能阻止嵌入的JSFiddle iframe滚动，因为它是嵌入式iframe中具有设定高度的iframe。

如果你不喜欢这个卷轴：

向jsfiddle提交问题：https://github.com/jsfiddle/jsfiddle-issues
请勿在您的网站上使用嵌入式jsFiddle。
制作Stylish样式，将iframe高度中嵌入的iframe设置为自动 - 这只适用于您的浏览器，但适用于您指定的网站。

在JSFiddle中禁用滚动功能

1 个答案: