4

You know, the 8 small iframes that show your most visited websites. How do they get the snapshots of the websites? How do they decide which websites to use? Just how do they work.

Edit: So that I can do something similar.

Edit 2: Is this not programming? I'm asking how to code an iframe that takes a snapshot of a websites.

  • 4
    Not a programming question.... – Marc B Oct 24 '13 at 18:33
  • 2
    In this case it's likely done internally within the browser, but you can somewhat take a screenshot of a webpage using canvas. http://stackoverflow.com/questions/4912092/using-html5-canvas-javascript-to-take-screenshots – Kevin B Oct 24 '13 at 18:35
  • Barring canvas, a headless version of Webkit works. – ceejayoz Oct 24 '13 at 18:52

2 Answers2

2

By using an internal method that shows the picture (in this particular case; chrome-search://thumb/53/22) ? Did you take a look at the source?

<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="common.css">
        <link rel="stylesheet" href="thumbnail.css">
        <script src="util.js"></script>
        <script src="thumbnail.js"></script>
    </head>

    <body dir="ltr">
        <a href="http://www.reddit.com/" ping="/log.html?pos=1" title="reddit: the front page of the internet" target="_top" tabindex="-1" style="color: rgb(119, 119, 119); font-size: 11px; font-family: arial, sans-serif;">
            <span class="shadow"></span>
            <!-- RIGHT HERE! -->
            <img src="chrome-search://thumb/53/22">
        </a>
    </body>
</html>

Have a look at chrome-search://most-visited/thumbnail.js:

    function createThumbnail(src) {...} // creates the thumbnails

you can try to remove the contents of

    function showDomainElement() {} 

if you don't want to see those in new tab page. I haven't tried this.

lambda
  • 3,295
  • 1
  • 26
  • 32
h2ooooooo
  • 39,111
  • 8
  • 68
  • 102
  • 1
    Have a look at chrome-search://most-visited/thumbnail.js function createThumbnail(src) {...} creates the thumbnails you can try to remove the contents of function showDomainElement() {} if you don't want to see those in new tab page..I haven't tried this. – ganesh Jan 08 '15 at 16:05
0

These snapshots are generated by internal layout engine. But, you can do it with some classes, like html2image, DOMPDF, etc.