Question

我想知道是否有办法以缩略图的形式从网站上实时预览网站？想法是用户输入他的帐户的URL，他以缩略图的形式获得网站的实时预览，就像谷歌浏览器有最近访问过的网站的快捷方式，但应该在任何浏览器中工作。我尝试使用iframe，但我得到了＃34;网站内的网站＆＃34;，可以点击链接，菜单等等。哈，真的很奇怪。谢谢;）

Answer 1

您可以iframe网站，用边框装饰它，使用CSS转换将其缩小为“缩略图”，然后使用CSS确保忽略鼠标交互。

#frame {
  border: 10px solid blue;
  width: 500px;
  height: 500px;
  pointer-events: none;
  -webkit-transform: translate(-200px,-200px) scale(.2, .2);
  -moz-transform: translate(-200px,-200px) scale(.2, .2);
  -o-transform: translate(-200px,-200px) scale(.2, .2);
  -ms-transform: translate(-200px,-200px) scale(.2, .2);
  transform: translate(-200px,-200px) scale(.2, .2);
  overflow: hidden;
}

<iframe id="frame" src="https://stackoverflow.com" scrolling="no"/>

Answer 2

使用带有src和text / html类型的embed标签例子

<embed src="+page+" type="text/html"/>

如何以缩略图的形式创建网站的实时预览？

2 个答案: