I am looking for a jquery package for website preview.
Website preview is basically when you add a website url inside input field, it should show brief description of that website with images (like facebook feed)
I have tried https://github.com/stephan-fischer/jQuery-LiveUrl. But it is not working properly in some cases.
Can any one suggest me a better package.
If you actually want a preview of the live page, you'll have to use an iframe. If you just want an image preview, Fulvio's suggestion will work, but won't show a "live" preview (i.e., no animations that you would normally see, if the user is logged in to a page, you will only see the front page, etc). It is possible to actually scale the contents of an iframe so that it's a thumbnail, thus achieving the effect you want. For example:
<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>
Have fun :)
Copy and paste into your browser's URL bar to preview:
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>
From:
The easy way of doing it, is to use:
http://www.jqueryscript.net/other/jQuery-Plugin-For-URL-Live-Preview-urlive.html
