<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d8211560\x26blogName\x3dTech+Tips,+Tricks+%26+Trivia\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dBLUE\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttp://mvark.blogspot.com/search\x26blogLocale\x3den\x26v\x3d2\x26homepageUrl\x3dhttp://mvark.blogspot.com/\x26vt\x3d-5147029996388199615', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Tech Tips, Tricks & Trivia

by 'Anil' Radhakrishna
An architect's notes, experiments, discoveries and annotated bookmarks.

Search from over a hundred HOW TO articles, Tips and Tricks


HOW TO take a full page screenshot of a web page directly with Firefox

In Firefox (version 33), use the shortcut Shift-F2 or open Tools > Web Developer > Developer Toolbar.

At the command line that appears, type the command:
screenshot filename.png --fullpage

Unlike the full page screenshot option with the Responsive Design View that generates screenshots at different screen resolutions and with a predefined filename, the above Developer Toolbar Command line option lets you name the file as you like.

The screenshot command accepts multiple  arguments to customize the screenshot images -

screenshot [filename] [--clipboard] [--chrome] [--delay ...] [--fullpage] [--selector ...]

Save a PNG image of the entire visible window (optionally after a delay)

Options:

    [filename] (string, helpManOptional)
    The name of the file (should have a '.png' extension) to which we write the screenshot.
    [--clipboard] (boolean, required)
    True if you want to copy the screenshot instead of saving it to a file.
    [--chrome] (boolean, required)
    True if you want to take the screenshot of the Firefox window rather than the web page's content window.
    [--delay ...] (number, helpManOptional)
    The time to wait (in seconds) before the screenshot is taken
    [--fullpage] (boolean, required)
    True if the screenshot should also include parts of the webpage which are outside the current scrolled bounds.
    [--selector ...] (node, helpManOptional)
    A CSS selector for use with document.querySelector which identifies a single element

I extracted the above information by typing this at the command line -
help screenshot

I was able to take the screenshot of a specific part of a larger web page by using the selector command line parameter -
screenshot hyderabad-book-stores.png --selector #businesses-nearby-slot

The command line provides hints inline for each parameter. Pressing F1 gives me even more help about the current parameter.

Labels: , ,

Tweet this | Google+ it | Share on FB

« Home | Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »

»

Post a Comment