Geek Answers Handbook

Html / CSS makes a live website image

I was looking for a link to a website wherever you are.

For example: I have a link to page A, so page A will be displayed in the image. If I want to change the color of page A, I don’t need to change the code in the link image, but just the code for the color on the page and the image will change color.

+8
javascript html css
source share
4 answers

You can just use a small iframe . I would put a link on top of it to prevent any interactions with this page. Otherwise, clearing the screenshot will require more than just HTML and CSS.

+2
source share

You can use a commercial service like Shrink the Web , which will provide an API for this feature. This is much more intense than just CSS / HTML.

+4
source share

If I understand your question correctly, these are your problems.

  • Use Iframes so that you can change the source code of the iframe with your changes, and it will be reflected in every place where it is used.
  • If you use jquery, knockout or any template engine, you can create a template. so that you can change it and reuse it.
+2
source share

There are free tools that do this,

you will not need to change the image, but they use the cache, and you may need to update the request to update the image

they are very easy to use, as this link shows a very small google snapshot, and you can use it in the html img tag: http://mozshot.nemui.org/shot/small?http://www.google.com/

My suggestion:

The first one (mozshot) is open source, so you can simply download and edit it, post it on your own website to update the image often or even after each update (which will live, but requires a lot of resource)

Here is the source code for mozshot: http://github.com/sugi/mozshot

Hope this helps

+1
source share

More articles:


All Articles