Save Contents of a <div> as an Image RRS feed

  • Question

  • User-481631678 posted

    I am not sure it is the appropriate place to put my question. However, I want to save the contents of a <div> element to an image. It is more or less like a screen shot, but only covers the area inside particular div. Can any one help me in it.

    Monday, July 6, 2009 3:47 AM

All replies

  • User-481631678 posted

    Thanks for reply, but these articles are related to exporting Text as image. I want a screen capture utility thrugh which i can capture all the content of a div as they are appearing on my browser.

    Monday, July 6, 2009 8:09 AM
  • User-925286913 posted

    Use free service provided by http://www.thumbshots.org/.

    Create a new page and give the URL of that page in which there is only one DIV with you content.

    Monday, July 6, 2009 10:27 AM
  • User-1419202310 posted

    Do this...

    <div id="painter" runat="server" style="left: 280px; ; top: 82px;
                width: 311px; height: 388px; background-color: #ccccff;">
            <asp:Button ID="Button1" runat="server" Style="left: 733px; ; top: 266px"
                Text="Button" OnClick="Button1_Click" />

      protected void Button1_Click(object sender, EventArgs e)
            string[] value = painter.Style.Value.Split(';');

            string width = value[3];
            string height = value[4];
            string bgcolor = value[5];

            string[] widthArray = width.Split(':');
            string[] heightArray = height.Split(':');
            string[] bgcolorArray = bgcolor.Split(':');

            int w = int.Parse(widthArray[1].Replace("px", ""));
            int h = int.Parse(heightArray[1].Replace("px",""));

            string color = bgcolorArray[1];

            System.Drawing.Color c = System.Drawing.Color.FromName("#ccccff");

            System.Drawing.Bitmap bt = new System.Drawing.Bitmap(w, h);
            System.Drawing.Graphics oGraphics = System.Drawing.Graphics.FromImage(bt);
            System.Drawing.Brush brush = new System.Drawing.SolidBrush(k);
            oGraphics.FillRectangle(brush, 0, 0, w, h);
            bt.Save("D:\\abc.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);


    Monday, July 6, 2009 11:31 AM
  • User-481631678 posted

    THanks for reply, but i want a generalized way to capture my web page's div. I am looking something similar to FireShot.

    Monday, July 6, 2009 11:56 PM
  • User-165141871 posted


    and what if this div had controls inside, how could I re-draw them all inside the image ??

    Thank you.

    Wednesday, December 9, 2009 8:02 AM
  • User-319574463 posted

    > I want a screen capture utility thrugh which i can capture all the content of a div as they are appearing on my browser.

    For a screen capture utility try GADWIN Web SnapShot and PrintScreen  from http://www.gadwin.com/download/

    Thursday, December 10, 2009 7:35 AM
  • User-567478654 posted

    Hi! Have you found any solution?? I have the same problem, could you help me?


    Saturday, November 24, 2012 12:16 PM