建议我使用 Jquery 包进行网站预览答案

【问题标题】：Suggest me Jquery package for website preview建议我使用 Jquery 包进行网站预览
【发布时间】：2016-06-01 10:47:11
【问题描述】：

我正在寻找一个用于网站预览的 jquery 包。

网站预览基本上是当您在输入字段中添加网站 url 时，它应该显示该网站的简要描述和图像（如 facebook 提要）

我试过https://github.com/stephan-fischer/jQuery-LiveUrl。但在某些情况下它无法正常工作。

谁能给我推荐一个更好的包。

【问题讨论】：

很抱歉这样说，但这对 SO 来说是题外话。老实说，我不知道你还能在哪里问这个……

标签： javascript jquery html

【解决方案1】：

如果您确实想要预览实时页面，则必须使用 iframe。如果您只想要图像预览，Fulvio 的建议会起作用，但不会显示“实时”预览（即，没有您通常会看到的动画，如果用户登录到页面，您只会看到前面页等）。可以实际缩放 iframe 的内容，使其成为缩略图，从而达到您想要的效果。例如：

<html>
<head>
<!--[if IE]>
<style>
#frame {
    zoom: 0.2;
}
</style>
<![endif]-->
<style>
#frame {
    width: 800px;
    height: 520px;
    border: none;
    -moz-transform: scale(0.2);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.2);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.2);
    -webkit-transform-origin: 0 0;
}
</style>
</head>
<body>
<iframe id="frame" src="http://www.bing.com">
</iframe>
</body>
</html>

玩得开心:)

复制并粘贴到浏览器的 URL 栏中进行预览：

data:text/html,<html><head><!--[if IE]><style>iframe{zoom:0.2;}</style><![endif]--><style>iframe{width:800px;height:520px;border:none;-moz-transform:scale(0.2);-moz-transform-origin:0 0;-o-transform:scale(0.2);-o-transform-origin:0 0;-webkit-transform:scale(0.2);-webkit-transform-origin:0 0;}</style></head><body><iframe src="http://www.bing.com"></iframe></body></html>

发件人：

jQuery Webpage Preview

简单的方法是使用：

http://www.jqueryscript.net/other/jQuery-Plugin-For-URL-Live-Preview-urlive.html

【讨论】：