How to copy images from websites that zoom the image when mousing over them?

Many sites like Aliexpress and other have a place where I can hover over to view the image. But I cannot seem to download the image.

Is there any way to download this type of image in Firefox?

red car

Posted 2016-01-12T06:30:24.053

Reputation: 43

you can get screenshot for image you like instead of downloading – mussdroid – 2016-01-12T06:46:50.140

But iw ant the resolution of that image. Screenshot doesnt give me that – red car – 2016-01-12T06:58:47.670

Maybe the sites don't want you to download the images Eg.500px, Instagram. In that case, one should not resort to means to download the images. I am voting for a close on this question for these reasons. – Firee – 2016-01-12T11:13:56.293

@Firee No, that's not reason why the images are blocked from the usual right-click -> Save As method of downloading an image in Firefox. The product images are organized into galleries of multiple images. To download any product image in an image gallery you need to read the source code of the webpage and find the block of code for rendering the image gallery in web browsers. – karel – 2016-01-12T12:32:15.400

@karel: So you are saying its legal to save images from sites like 500px.com or Instagram using these methods? Isn't there a thing called copyright which should be kept in mind. – Firee – 2016-01-12T12:54:15.390

You want to apply a copyright test to this question because the product image links are nested inside of a pair of <div> tags. – karel – 2016-01-12T13:10:09.117

1The hover-zoom feature isn't a single image, which is why you can't select it in the normal way. Hovering selects from multiple images and provides scrolling functionality, so it's more like interacting with a program. If you view the page's source, you will often see the URLs for the various size images. – fixer1234 – 2016-01-12T18:11:47.570

Answers

In Firefox go to any product page at the AliExpress website and select a product.
Right-click the image and select Open Link in New Tab.
Switch to the new tab and you will see a large product image, and above it a gallery of thumbnail images, usually 6 thumbnail images, which can be clicked to view the product from different viewpoints. From the Firefox menu select Web Developer -> Page Source.
On the Page Source tab find the line that says <div class="image layout-left">
Under that line will be the links to all the original size product images on that webpage. If there is an image gallery that contains more than one image, there will be a list of images containing one link for each image in the image gallery. If there are 6 thumbnail images above the large product image, there will be 6 links to original size images in the list.
Open the link to the image you want to save in a new tab.
A new tab will open containing only one image in the center of the page surrounded by a dark gray background. Right-click on the image and select Save Image As... to save the image to your computer.

karel

Posted 2016-01-12T06:30:24.053

Reputation: 11 374

Update for Aliexpress.com - full images are wrapped in JavaScript now, so simply opening in a new tab no longer works.

Right-click at the very top of a product page, and click "Inspect Element (Q)".
In the Developer Tools "Search HTML" text field, search for "j-detail-gallery-main".
Expand the found div id - <div id="j-detail-gallery-main"> and just before that div closes you will see some JavaScript - <script type="text/javascript"></script>.
Expand that JavaScript and here you will find the full path to each of the full sized .jpg images for that product, which can be opened/saved as desired.

user1138

Posted 2016-01-12T06:30:24.053

Reputation: 77

It is possible, but making a screenshot is way easier.

If you go to Aliexpress and choose a product, you can click on the image. This will show the image on its own page.

Now you can press 'ctrl + u' ( might be an other combination on other browsers than chrome or firefox ) to show the code behind the page.

Search for the 'img' attribute. These attribute holds an link which will link to the plain image. This one can be downloaded ( be sure to not choose the 50x50 images, those are the smaller placeholders).

ltv

Posted 2016-01-12T06:30:24.053

Reputation: 1

When you say click on the image and it will show image on its own page is not correct. There are sites which will only give you a thumbnail that way but you will see a larger file if you hover over them. – pun – 2016-01-12T10:47:12.833

tried this on this image http://www.aliexpress.com/item-img/New-Electric-self-balancing-Scooter-Smart-wheel-hover-board-unicycle-Standing-Skateboard-drift-scooter-airboard-free/32562397613.html. this is the result: http://g02.a.alicdn.com/kf/HTB1EbWkKVXXXXXtaXXXq6xXFXXX1/Electric-self-balancing-scooter-hoverboard-unicycle-Smart-wheel-Skateboard-hoverboards-two-wheels-electric-scooters-by-battery.jpg

– ltv – 2016-01-12T10:47:49.490

Aliexpress is just an example OP pointed to. Do you think OP wants 168 x 168 image after going through source ? http://i.stack.imgur.com/dLu2l.png

– pun – 2016-01-12T10:53:24.273

My guess is that you are looking in the wrong place, or the website is using a technique I am not familiair with. Even if it uses javascript to display a different image on hover it can be obtained. But as I stated before, it might not be easy. – ltv – 2016-01-12T10:57:16.247

I know what you are talking about & yes I am talking about the tricks some websites use to hide images and videos. Don't remember a website for images but try finding the direct link to a .mp4 video in youtube. which is not impossible, thats why downloader exist but still a magic to naked eye – pun – 2016-01-12T11:07:19.280

Try using page info on Firefox (Tools - Page Info - Media). If you use the new Firefox, pressing "Alt" on the keyboard will make the old menu bar appears.

There you can view all images appearing on the webpage you are visiting. To save the image, just click on the image address and click "Save as".

If you cannot find the image you are looking for, then I suggest to right-click the webpage and choose "Inspect" (Chrome) or "Inspect Element" (Firefox).

Click on the left-most icon on the tool and use it to highlight the image you want to save. Then the tool should show you the address of the image.

If you don't know how to use this "Inspect" tool, you can ask someone familiar to web design.

Arthz

Posted 2016-01-12T06:30:24.053

Reputation: 41

Right-click the image and select save Save Image As to save the image to your computer.

you can drag the image to the new tab button on the browser to open it into new tab then you can Right-click the image and select save to save the image to your computer.

And if the image is not able to drag, and not having the save as option the you can use Capture Page plugin in your browser the instruction of using it is here:

For Chrome:

https://chrome.google.com/webstore/detail/capture-webpage-screensho/mcbpblocgmgfnpjjppndjkmgjaogfceg

For Firefox:

https://addons.mozilla.org/en-US/firefox/addon/fireshot/?src=search

AsimRazaKhan

Posted 2016-01-12T06:30:24.053

Reputation: 230

-1

I discovered it... richt click any browser will do. Then select Inspect, then a sidewindow appears, now you can do richt click on the image and it gives you the normal options like save as, or open at new window, and at new window if the image is even bigger, it lets you zoom in with the magnifying glass icon and then you can do right click on it and hit save as... that way you get the best resolution picture you can from the original website.

Busts

Posted 2016-01-12T06:30:24.053

Reputation: 1

What does this provide that other answers do not? – Pimp Juice IT – 2017-09-05T17:46:35.903