你如何仅在HTML中嵌入JsFiddle作为iFrame?

时间:2017-05-03 04:50:32

标签: javascript html iframe jsfiddle

当我将JsFiddle嵌入我的网站时会发生这种情况:

http://i.imgur.com/JkDefod.png

我可以做什么,以便我的嵌入式JsFiddle只显示正在运行的程序而不是上面的额外文本?

这是我的JsFiddle代码:

#import <Cocoa/Cocoa.h>

@interface ThoughtItems : NSCollectionViewItem

@end
var handler = function() {
  if (--sec < 0) {
    sec = 59;
    if (--min < 0) {
      min = 0;
      sec = 0;
    }
  }
  var min1 = "0" + min + "m";
  var min2 = min + "m";
  var sec1 = "0" + sec + "s";
  var sec2 = sec + "s";
  document.getElementById("time").innerHTML = (min < 10 ? min1.fontcolor("red") : min2.fontcolor("red")) + ":".fontcolor("red") + (sec < 10 ? sec1.fontcolor("red") : sec2.fontcolor("red"));
};
var sec = 0;
var min = 15;
handler();
setInterval(handler, 1000);

2 个答案:

答案 0 :(得分:2)

您可以直接在页面中添加此代码,或使用嵌入的JsFiddle,执行以下操作:

<div class="someClass">
<script async src="//jsfiddle.net/DiogoBernardelli/vuc85mok/embed/result/"></script>
</div>

并将其添加到样式表(.css)文件中:

.someClass iframe {
height: 200px //you can manually change this height
}

答案 1 :(得分:0)

如果您只想在网页上添加此倒数计时器,为什么不在div之后在标签中添加JS代码?

这样的事情:

<body>

<div id="worked"></div>
<h1 style="text-align: center;"><span style="color: #ff0000;"><strong>Offer Ends In:</strong></span></h1>
<h1 id="time" style="text-align: center;">&nbsp;</h1>

</body>

<script>
var handler = function() {
  if (--sec < 0) {
    sec = 59;
    if (--min < 0) {
      min = 0;
      sec = 0;
    }
  }
  var min1 = "0" + min + "m";
  var min2 = min + "m";
  var sec1 = "0" + sec + "s";
  var sec2 = sec + "s";
  document.getElementById("time").innerHTML = (min < 10 ? min1.fontcolor("red") : min2.fontcolor("red")) + ":".fontcolor("red") + (sec < 10 ? sec1.fontcolor("red") : sec2.fontcolor("red"));
};
var sec = 0;
var min = 15;
handler();
setInterval(handler, 1000);
</script>