Home/ Questions/Q 893859
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T14:17:17+00:00

Does anyone know of a plugin that allows you to roll over an anchor

  • 0

Does anyone know of a plugin that allows you to roll over an anchor link and see a preview of the webpage?

So essentially we may have a link on the page to say http://www.mysite.com and when you roll over the link I’d like to see a preview of the site.

I know there are plugins out there that show you an image file but I’m looking for something that will preview the live page.

Edit

I’d like to see a thumbnail of the page.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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>
    • 0