Href Image Link Download on Click

href image link download on click

<a download="custom-filename.jpg" href="/path/to/image" title="ImageName">
    <img alt="ImageName" src="/path/to/image">
</a>

It's not yet fully supported caniuse, but you can use with modernizr (under Non-core detects) to check the support of the browser.

How to download a image on link click instead of opening it

You can use JS to add download attribute to a HTML element:

element.setAttribute('download','')

Or even simpler:

element.download=''

So, you can easily add this for each link with a href ending .jpg:

const links=document.querySelectorAll('a[href$=".jpg"]')
links.forEach(link=>link.download='')

Try to download image from image URL, but I get HTML instead

In your "Accept" header you are not specifying any graphic formats.

A properly configured web server should send you a representation of the resource in one of the formats you accept.

Try looking at the request headers sent from your browser (use the Developer Tools - see your browser's help for how to access them). It will be accepting graphic formats as well as text.

href image link download on click

<a download="custom-filename.jpg" href="/path/to/image" title="ImageName">
    <img alt="ImageName" src="/path/to/image">
</a>

It's not yet fully supported caniuse, but you can use with modernizr (under Non-core detects) to check the support of the browser.

---

Related Topics