I've an image that I want to download on IE. After looking at Google and several stackoverflow questions I found that the best solution for the other common browsers is the HTML5 download attribute:
<a href="/barImage.jpg" target="_blank" download>Foo</a>
But this attribute is not currently supported on IE. And it just opens a new tab with the image on IE (Because it's a known file extension)
Is there any way to force the download of an image file just using html and without zipping it or any other method of this kind?
Please don't indicate javascript libraries.
I think you will not get far without JS.
Microsoft supports this tag from the Edge browser. Do you really need it for older versions?
I just read something else. You can try to fill the download attributes with a filename, so:
... download="sample.png" ...
I found this Codesnippet (force browser to download image files on click):
var link = document.createElement('a');
link.href = 'images.jpg';
link.download = 'sample.jpg';
document.body.appendChild(link);
link.click();
But I´m not sure, if this is correct...
Related
As the title says, I'd like to download a mp3-file instead of playing it in Firefox.
I do it like this:
<a href="http://test.com/path/to/my/file.mp3" download></html>
In all other browsers the file is downloaded, only Firefox starts playing the audio file instead of asking me if I would like to save it to my hard disk.
Write this
<a href="http://test.com/path/to/my/file.mp3" download></html> WRONG
should be
download
Tested 8/18, Firefox correctly handles a simple download attribute. The accepted and second-ranked answers are wrong, at least as of now.
So, simply,
<a href="http://test.com/path/to/my/file.mp3" download></a>
will work, and if you want to control what the file is downloaded as, you give download a value:
That is why Chrome (or any modern browser) will download it as "true.mp3" if you try to use download="true" instead of a simple download to force the file download.
Also, note that <a></html> in the question isn't valid, and could have possibly caused a problem at the time if that's not just a typo.
I used <a href="http://test.com/path/to/my/file.mp3" download >download</a>
If you use the download="true" inside the anchor This will result in the renaming of the file name to true.mp3 in chrome an firefox as mention above.
This is the correct way to force the download:
download
NB: it will work on Firefox only if the file is located on the same domain unfortunately, cf. https://bugzilla.mozilla.org/show_bug.cgi?id=874009
I am using a download attribute in my link:
<a style="color:white" download="myimage" href="images/myimage.jpg">Download image</a>
It is working very well in almost all browsers. This means, if I click on the link the image is automatically downloaded. I tested it in safari 10.1.2 on my mac and it is working fine.
But on my friends mac who is working with safari 10.0.3 it is not working. He is saying that the image is only opening in a new window but not downloading.
Why is this happening and what can I do to make it work anywhere?
According to https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_1.html, it was added in Safari 10.1:
HTML5 Download Attribute
The download attribute for anchor elements
indicates that the link target is a download link that downloads a
file, instead of a navigational link. When you click a a link with the
download attribute, the target is downloaded as a file. Optionally,
the value of the download attribute provides the suggested name of the
file.
It doesn't seem to be available in iOS Safari 11.1 though from my own testing, which has me a bit confused. I'd expect them to be equal in standards support, based on their similar version numbering.
try this code:
var element = document.createElement('a');
var clearUrl = base64.replace(/^data:image\/\w+;base64,/, '');
// element.setAttribute('href', 'data:attachment/image' + base64);
element.setAttribute('href', 'data:application/octet-stream;base64,' + encodeURIComponent(clearUrl));
element.setAttribute('download', 'filename.jpg');
document.body.appendChild(element);
element.click();
document.body.removeChild(element)
This is work for me in safari version 10.0.3
Please take a look at https://www.w3schools.com/TagS/tag_a.asp
Scroll down to attributes, and you will see that the DOWNLOAD attribute is only supported by HTML5, which, as it seems, your friend's version of Safari does not support. I recommend updating the program.
Alternatively, you can right-click on the image, then click Save As..., then download it that way.
#Jarla
I'm trying to access a document template (.dot) that's linked from a company portal, using chrome. When I click on the link, the browser shows me a bunch of garbage. Is there a setting to force chrome to download this type of file and open it in word?
Example of garbage:
For HTML5:
<a href='file.dot' download>Click here to download</a>
'Download' attribute documentation can be read at:
http://www.w3schools.com/tags/att_a_download.asp
Supported since chrome 14.0.
EDIT: However this is controlled by the site. As for client-side settings, i think only changing the .DOT extension to match Word files in Windows, and perhaps even that won't work if chrome uses its own list.
In any case, you can right-click and "Save file as...", but yes, it's annoying.
Tried this:
Download Your Foo
Chrome unfortunatelly completely ignores the download attribute.
What can I do? Ideally to make it cross-browser...
Thanks
Have you tested this on any other web browsers.
According to w3schools here, it is an HTML5 attribute and internet explorer and safari do not support it. So, if you are looking for cross-browser, this probably isn't the best solution.
Also the link you have composed is wrong, if you downloaded google.com it points to index.html(I checked) .
I tried <a href="http://www.google.com" download>Here</a> and opened it in the latest chrome and it downloaded index.html. So if you need google chrome compatibility do a download attribute with "[your choice].html".
If you would like cross-browser compatibility I suggest you use php to change the headers then echo google's source. If you are unfamiliar with php go to
here
As the title says, I'd like to download a mp3-file instead of playing it in Firefox.
I do it like this:
<a href="http://test.com/path/to/my/file.mp3" download></html>
In all other browsers the file is downloaded, only Firefox starts playing the audio file instead of asking me if I would like to save it to my hard disk.
Write this
<a href="http://test.com/path/to/my/file.mp3" download></html> WRONG
should be
download
Tested 8/18, Firefox correctly handles a simple download attribute. The accepted and second-ranked answers are wrong, at least as of now.
So, simply,
<a href="http://test.com/path/to/my/file.mp3" download></a>
will work, and if you want to control what the file is downloaded as, you give download a value:
That is why Chrome (or any modern browser) will download it as "true.mp3" if you try to use download="true" instead of a simple download to force the file download.
Also, note that <a></html> in the question isn't valid, and could have possibly caused a problem at the time if that's not just a typo.
I used <a href="http://test.com/path/to/my/file.mp3" download >download</a>
If you use the download="true" inside the anchor This will result in the renaming of the file name to true.mp3 in chrome an firefox as mention above.
This is the correct way to force the download:
download
NB: it will work on Firefox only if the file is located on the same domain unfortunately, cf. https://bugzilla.mozilla.org/show_bug.cgi?id=874009