Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
  • How to use HTML5 download attribute

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 759
    Comment on it

    HTML5 provides download attribute that can be used in place of PHP-driven file download scripts. In this article, you will come to know about this new attribute of html5.

    One Attribute, Two Functions
    download attribute sets a file download name and the target name is different that actual link has.

    <span><a href=abc.pdf" download=note.pdf">Download here</a></span>

    It can also download the images instead of navigating to the file.

    <span><a href=imgname.jpg" download /a></span>

    Downloading Multiple Files with One Click

    If you want to give the user this option of downloading page of images by clicking on "Download All" link. Here is the example:

    <span><a href="" download="rob1.jpg" class="download_file"><img src=""></a>
    <a href="" download="rob2.jpg" class="download_file"><img src=""></a>
    <a href="" download="rob3.jpg" class="download_file"><img src=""></a>
    <a id="downloadAll" href="#">Download All Images</a></span>
    <span>$(document).ready(function() {
      $('#downloadAll').click(function() {
          $('a.download_file > img').each(function() {
            $(this).trigger( "click" );
        return false; //cancel navigation


 0 Comment(s)

Sign In

Sign up using

Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: