Develop Reference

I want to grab a screenshot or logo of a website with only its URL

I'm trying to develop a chrome extension and I want to mimic how browsers are able to grab a screenshot or logo of a website by only its link. You usually see it when you open a new tab. I'm using json, javascript, css and html.
Below is the examples of those.
(https://i.stack.imgur.com/upxrr.png)(https://i.stack.imgur.com/KKMpb.png)
I've tried to search for within the Chrome API Documentation, but I couldn't find anything on it. I've also tried to use iFrames, but they are extremely insufficient and they don't resize well on a smaller display.

Do you have an specific use case for that?, if not i think you could save a lot of time implementing it yourself.
You could import a custom png or svg file and wrap it with a tag
<a href="link">
<img src={yourImgSrc} width={} height={}></img>
</a>

How to download a file without the "Leave the Page" dialog or any other prompt?

In Internet Explorer 10; When i try to download a file; i get following dialog box:
Is there someway in Jquery or HTML with which this box does not get appear when user tries to download a file in application?
Update:
Also could not user target blank as flashing of new tab should not be there(customer requirements).
As asked for code, it is simple link:
<a href="www.something.com/something/something.pdf" >

jquery.fileDownload.js will help you in this.
apply file path to
function downloadPDF(thisobj) {
$.fileDownload($(thisobj).attr("href"));
}
Call this funciton on
<a href="www.something.com/something/something.pdf" onclick="downloadPDF(this)">

I'd suggest you look into HTML5's download attribute.
Excerpt from the site:
Place the download attribute on a link...
<!-- will download as "expenses.pdf" -->
Download Your Expense Report
...and when the user clicks the link, the download attribute appears
in the save dialog instead of the garbled mess that was there before.
In this case, the file will be downloaded as expenses.pdf. The
download attribute also triggers a force download, something that I
used to do on the server side with PHP.

Image Download Button for Wordpress

How can I add custom image download button for Wordpress?
I mean when we click on download button, instantly image downloading starting without any pop up or warning.
Please help me with all required codes.
Thanks...

from the formatting of your question, I'll assume that you're not too technical. To do this properly you'll need to do some work on the server, to send the file requested by the client with the correct headers.
There is a simple dom method to do it though, have a look at
http://caniuse.com/#feat=download
Though its not widely supported, it may be a viable and simple solution.
<a href="/path/to/image" download>
<img src="/path/to/image" />
</a>
There is also a handy plugin for WordPress that will help with downloads, there may be others, but have a look at
https://wordpress.org/plugins/wp-downloadmanager/
There is also many discussion on SO here regarding this, so in the interest of brevity have a look at these if you'd like a more robust and complete solution
Example given with PHP
href image link download on click
Expamle given with server config and JS
Force Download an Image Using Javascript

Do you want like this link updated
<a href="#" download="image.jpg" title="ImageName">
<img src="http://www.teluguone.com/photos/images/download_new.png" alt="ImageName">
</a>

Client-side data saving to hard drive

I need to save some table content in my html page frame by clicking a button. After that in "Save as" dialog box I want to select a file name and save it somewhere.. The question is how to do this. I see at least two ways. 1st one is server-side, 2nd is client-side. For some reasons I prefer to use the client-side approach. But how to do this? Which technology to prefer? Of course it needs to support most popular browsers. And somehow I need to show "Save as" dialog to the user to allow him/her to select the file location.

If I understand what you're trying to do, maybe try base64 encoding it into a data URL, then setting that as the value of the link to Save as. You can use the btoa() native function in Javascript to take a string, encode it to base64, and ask the user right-click and save link as.
<script LANGUAGE="Javascript">
function initialize(berliner) {
document.getElementById("aharef").href="data:text/plain;base64,"+btoa(berliner);
}
</script>
Just an example link. Right click and save as to save when ready.
<input type="button" value="Get ready." onClick="initialize('I am a jelly donut.');">

Short:
That is not possible on client-side.
Long:
Using standard HTML5 technologies you can only read files using the File API. The only way to really save a file programmatically to the user's hard drive is by using Microsoft's ActiveX technology (which is ugly and only works in IE).
Solution:
In your case I'd suggest to provide a button, which causes your application to create the document having the necessary formatting and send it as a download to the user.

Refining the answer by tomysshadow (which I upvoted):
<script LANGUAGE="Javascript">
function initialize(txt) {
document.getElementById("theLink").href="data:text/plain;base64,"+btoa(txt);
}
</script>
<a
id="theLink"
download="myFile.txt"
href="javascript:"
onclick="initialize('Here is the contents of the file');"
>Save</a>
With this code there is no need to prepare the download before doing it. You also do not need to right click and select Save link as. And you can specify the name of the file in the code. I tried it in Firefox only.
Try it here https://jsfiddle.net/ad3u85ym/

Reading the activeDocument in Photoshop and send it to web page or clipboard API

I'm new to Photoshop scripting and javascript. How can I read via code the image inside the active window in Photoshop CS5-C6 and paste that image into a web page DIV?
FYI I'm a complete newbie to programming. My goal is to build a simple Mac App prototype with a wrapper running a web app inside. That web app needs to connect to Photoshop via TCP and read the image inside the selected window document and then paste it somehow into the web app's html. (Photoshop has feature inside the edit menu called 'remote connections' that converts Photoshop into a server and allows any external applications to read/write stuff inside Photoshop by sending javascript over TCP)
So, how can I:
1) Access Photoshop over TCP via javascript?
2) How can I get the image inside the active Photoshop window and paste into the web app?

I might need some additional information to help more accurately, but if I understand correctly I'd say you are running your code on your local machine.
Please post the development environment you are using (Visual Studio, eclipse, etc.)
First Approach
You will want to save you Photoshop image and add that file to your project. Just in case, I would recommend actually moving the image into your project folder first.
So, if you saved the image to "C:/Username/Pictures" - move it to "C:/Documents/Visual Studio 2010/Projects/MyWebPage"
Once you've done that, just add an IMG tag and the file path. If you moved the image into the project folder, the path should just be the filename:
<div>
<img src="myPhotoshopImage.gif" alt="Image">
</div>
You can put whatever you like inside the alt quotations (""), it doesn't effect the way it works. You can also specify the dimensions by adding height and width (this is optional) like so:
<div>
<img src="myPhotoshopImage.gif" alt="Image" height="260" width="420">
</div>
Second Approach
If you don't want to worry about managing your image files in your project, you can choose to host them online.
First, save your imagine in photoshop. Then choose an image hosting service. I would suggest ImageShack for an easy start. I would also suggest creating an account to keep track of everything.
Log in to ImageShack and go to the "Media Upload" tab. Click the "Browse" button and locate your image. Click OK. If you want your image to appear the same as it looks on your computer, make sure "Do Not Resize" is selected. Finally, click "Upload Now" & "Continue to Image Links" on the following page.
You will notice they have generated an HTML link for you already, which will work - but will also act as a link to ImageShack if clicked on. If you want to avoid that, just follow the same pattern:
<div>
<img src="http://img541.imageshack.us/img541/2232/123vm.jpg" alt="Image" height="260" width="420">
</div>
You'll need to do some research on any other actions you want the embedded image to take. A great place to start is W3Schools.
Edit - Forgot to mention... If you are wanting to use some javascript functions to work with the image, give your image an "id" attribute:
<img src="something.jpg" alt="whatever" id="headerImage">
You can now access the image via javascript:
function foo() {
var myImage = document.getElementById("headerImage");
myImage.height = 1000;
myImage.width = 832;
};
Also, if you are having any trouble, make sure your image is saved as a common filetype (not .psd)

There is a python wrapper for connecting to photoshop called photoshopConnection
One thing you can do is get the actual file info from PS and then copy the file itself into the webapp. I do not think the photoshop server supports streaming data in the fashion you are looking to.