web-dev-qa-db-fra.com

aperçu de la page Web jQuery

Est-ce que quelqu'un connaît un plugin qui vous permet de survoler un lien d'ancrage et de voir un aperçu de la page Web?

Nous pouvons donc essentiellement avoir un lien sur la page pour indiquer www.monsite.com et, lorsque vous cliquez sur le lien, cliquez sur le lien pour voir un aperçu du site.

Je sais qu'il existe des plug-ins qui vous montrent un fichier image, mais je cherche quelque chose qui permettra de prévisualiser la page en direct.

Modifier

J'aimerais voir une vignette de la page. 

jqueryjquery-plugins
25
griegs

Si vous voulez réellement un aperçu de la page en direct, vous devrez utiliser un iframe. Si vous voulez juste un aperçu de l'image, la suggestion de Fulvio fonctionnera, mais ne montrera pas d'aperçu "en direct" (c'est-à-dire, aucune animation que vous verriez normalement, si l'utilisateur est connecté à une page, vous ne verrez que l'avant page, etc). Il est possible de redimensionner le contenu d’un iframe pour qu’il s’agisse d’une vignette, obtenant ainsi l’effet souhaité. Par exemple:

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

S'amuser :)

Copiez et collez dans la barre d'URL de votre navigateur pour prévisualiser:

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>
61
crazy2be

qTip est un plugin d'info-bulle pour le framework jQuery. C'est multi-navigateur, personnalisable et bourré de fonctionnalités.

http://craigsworks.com/projects/qtip/demos/content/thumbnail

METTRE À JOUR:

qTip 1.0 sera bientôt obsolète ... consultez le qTip2 preview .

4
fuzz

Plus de services de vignettes sur Site Web gratuit Services de vignettes . Mais ils pourraient toujours mettre en cache des images, tout comme WebSnapr.

0
Gert Grenander