Je dois prendre une capture d'écran d'une page Web entière. L'astuce est que j'ai besoin de la capture d'écran pour inclure tout le contenu d'un seul élément qui ne rentre pas dans l'écran.
C'est une table à une seule colonne qui a une barre de défilement en raison de sa hauteur. Ce n'est pas un IFRAME (qui serait simple à charger dans son propre onglet).
La colonne contient du texte formaté et quelques petites images.
Pour les longues pages Web qui défilent, il est facile d'exécuter cette tâche. Mais comment peut-il être accompli quand il contient un élément individuel dans la page qui défile?
Pour être clair, je dois capturer la page entière, pas seulement l'élément lui-même.
Je voudrais accomplir ceci en utilisant Firefox sous Windows.
Réponses:
Ma suggestion est d'utiliser la fonctionnalité intégrée de Firefox qui vous permet de prendre des captures d'écran d'un seul élément du DOM.
Il suffit d'ouvrir les outils de développement → Trouver l'élément → Clic droit et prendre une capture d'écran
Cela n'a pas fonctionné sur l'un de mes sites internes, donc je ne peux pas dire que cela fonctionnera pour tous.
Mise à jour après la modification de l'OP:
Si vous souhaitez enregistrer toute la page avec l'ensemble du contenu de l'élément DOM, comme indiqué ci-dessous, vous devez modifier en direct la hauteur de l'élément DOM, mais ...
Il va écarter de nombreux éléments du DOM de la fenêtre d'affichage et de la capture d'écran ou, autant que je sache, aucun autre outil ne le capturera, ce qui va à l'encontre de votre objectif, je pense.
Lire ci-dessous à partir de https://en.wikipedia.org/wiki/Screenshot
Si je devais vraiment le faire à votre façon, je créerais un GIF ou prendrais deux captures d'écran, une page entière et l'autre seulement de l'élément DOM, pour en fusionner une.
la source
<body>
élément et il vous donnera la capture d'écran souhaitée.Vous pouvez utiliser la commande screenshot de la barre d’outils du développeur:
Appuyez sur Shift+ F2pour ouvrir la barre d’outils ou sélectionnez-la dans le menu Outils de Web Developer.
Dans la barre d'outils, tapez la commande
screenshot --fullpage fullpage.png
.Pour capturer un seul élément, vous pouvez utiliser son sélecteur css avec l'indicateur --selector, par exemple
vous obtiendrez l'image ci-dessous
la source
Utilisez le mode de conception réactif de Firefox , définissez la largeur sur quelque chose de normal et la hauteur suffisante pour englober toute la page, cliquez sur le bouton de capture d'écran (l'icône de la caméra).
la source
Il existe un logiciel appelé Snagit qui peut résoudre votre problème. Ce logiciel peut prendre la capture d’écran sous différents types, comme une fenêtre défilante, et peut aussi enregistrer de la vidéo.
Il s’agit d’une application payante, mais un essai est également disponible.
la source
J'utilise Screenpresso . Il vous permet de prendre une capture d'écran avec défilement. En gros, vous prenez une capture d'écran, faites défiler l'écran et prenez-en une autre, etc., puis Screenpresso les assemble. Screenpresso est également gratuit.
Pour votre information, les touches de raccourci pour faire défiler la capture d'écran sont WindowsKey + Shift + PrintScreen. Vous devez ensuite cliquer sur la fenêtre que vous souhaitez faire défiler. Lorsque vous arrivez à la partie suivante de la capture d'écran, cliquez avec le bouton droit de la souris, faites défiler vers le bas, cliquez avec le bouton droit de la souris, etc. Lorsque vous avez terminé, faites un clic gauche et ils seront cousus ensemble. Assurez-vous que chaque capture d'écran se chevauche pour que le processus d'assemblage fonctionne mieux.
la source
Il existe une extension appelée Nimbus Screen Capture qui convient parfaitement à cette tâche.
Vous avez la possibilité de capturer:
la source
Options pour tout adapter sur une seule page:
<Ctrl>-
pour tout adapter sur une seule pageUne autre option consiste à prendre une capture d'écran de la partie supérieure de ce que vous souhaitez capturer. Faites défiler vers le bas, prenez la prochaine capture d'écran. Répétez cette opération jusqu'à ce que vous ayez tout capturé.
Facultatif: combinez les captures d'écran en une seule grande image à l'aide d'un éditeur d'image (par exemple, Gimp).
la source
Pour prendre des captures d'écran, vous pouvez ajouter une extension telle que capture d'écran facile. Il vous sera alors beaucoup plus facile de prendre des captures d’écran.
la source
Pour les programmes DESKTOP, avec la fenêtre de défilement, la capture d’ApowerSoft a fait le travail pour moi.
la source