Comment créer url aperçu dans le JavaScript?

Quelqu'un peut m'aider avec la création d'une url aperçus en JavaScript?

Ce que je veux dire est ceci: Dire que j'ai un lien sur mon site, je veux que l'utilisateur soit en mesure de la souris sur le lien, et ont une image pop-up qui indique quelle est la cible du lien ressemble.

Ne vous inquiétez pas au sujet de la css, j'ai obtenu ce travail, j'ai juste besoin du script pour afficher l'image.

Actuellement, je suis en train de faire elle en montrant une iframe qui génère la page, mais ce n'est pas extensible et semble laid.

Avoir l'affichage de la page premade images n'est pas une option, car les liens seront en les reliant à généré dynamiquement le contenu de l'utilisateur.

Pourrait un mod donner à ce 'PHP' ou '.net' tag? Il n'y a vraiment pas un moyen pour que cela soit fait en JS seul.

OriginalL'auteur Razor Storm | 2010-04-26

  1. 5

    Vous avez besoin d'avoir des pré-images stockées. Javascript ne peut pas prendre des captures d'écran et de les redimensionner les images (pour l'instant). Essayez ceci: http://snapcasa.com/ . Il prend des images dynamiquement pour vous. Tout ce que vous avez à faire est de chaude lien des images 🙂

    Les meilleures caractéristiques lors de l'utilisation de http://snapcasa.com/:

    1. Images sont garantis d'être le plus up-to-date

    2. Vous n'avez pas à les stocker sur votre serveur!

    3. Plan gratuit a beaucoup de crédits pour vous brûler!

    Ne snapcasa projet encore du travail?

    OriginalL'auteur Viet

  2. 3

    Daniel est droit, il n'y a aucune façon, le client pourrait faire cela, mais une option serait une gratuit thumnail service; http://www.webresourcesdepot.com/10-free-website-thumbnail-generation-services/ combiné avec une belle bulle d'aide de script: http://flowplayer.org/tools/tooltip.html

    Merci! J'ai essayé snapcasa (qui a également été mentionné par la première réponse), et ça marche! J'ai fait ma propre info-bulles de code, mais le plugin vous me lie a l'air sympa, je vais le garder à l'esprit pour de futurs projets.

    OriginalL'auteur meo

  3. 3

    Si vous voulez plus de contrôle direct sur les captures d'écran et souhaitez le configurer sur le serveur, vous pouvez configurer khtml2png ou webkit2png* pour générer des images en ligne de commande. (Et ici est une orientation vers l'utilisation Gecko si vous préférez.)

    * webkit2png fournit des instructions pour OS X, mais il n'y a vraiment aucune raison pour que cela ne devrait pas fonctionner sur *nix, est que WebKit est lui-même la croix-plate-forme. En pensant que peut être laissé comme exercice pour le lecteur, mais il peut être utile que KHTML a toujours été à la traîne derrière WebKit pour les nouveaux (HTML5, CSS3, etc).

    Je n'ai pas testé l'une de ces solutions, mais il pourrait être suffisant pour commencer si vous voulez plus de contrôle sur la capture d'écran de la génération.

    OriginalL'auteur eyelidlessness

  4. 2

    Site aperçus ne peut pas être généré sur le côté client. L'aperçu de l'image doit être rendu sur le serveur, qui peut ensuite être appelée dans votre document HTML avec un simple <img> tag.

    Fondamentalement, vous pourriez avoir une balise d'image tels que les suivants:

    <img src="/my_preview_renderer.php?site=www.google.com" />

    ... où my_preview_renderer.php va générer l'aperçu en temps réel et de retourner les données de l'image avec le mime-type. Vous pouvez utiliser n'importe quel langage de script côté serveur.

    Ce n'est pas une réponse exhaustive, mais j'espère que cela peut vous diriger dans la bonne direction.

    Alors, comment pourrais-je aller sur le faire côté serveur?
    Je vais le laisser pour que pour les autres réponses, car je n'ai pas de réelle expérience dans la génération de prévisualisation. Cependant, je comprends que c'est pas banal pour générer des aperçus, surtout lorsque les sites web utilisent le JavaScript, le flash, et d'autres plugins.
    j'ai besoin de votre aide pour résoudre mon problème, je veux créer une petite application. Il doit y avoir une zone de texte et quand j'ai coller un lien dans la zone de texte, j'ai besoin de voir l'aperçu.[ son comme quand nous coller un lien, tout en bavardant dans facebook, nous allons récupérer la petite preview pour ce lien ]

    OriginalL'auteur Daniel Vassallo

  5. 1

    Vous pouvez le faire à l'aide d'un iframe, ou de payer pour un service qui prend des captures d'écran (Doctype.com offre ce, je pense). Le service payant va encore prendre beaucoup de temps pour générer des captures d'écran. Fondamentalement, n'est pas la peine d'essayer, il ne va pas au travail.

    OriginalL'auteur Amy B

  6. 1

    bien, je pense que puisque toutes les réponses ici sont un peu vieux, maintenant vous pouvez le faire en utilisant le web intégré, kit d'outils dans la plupart des navigateurs actuels, en utilisant webrtc,ou ffmpeg outils disponibles en js une telle approche peut être fait en quelques minutes

    OriginalL'auteur Negm Sherif