One click download gif javascript

Then if you change the href, the url will change without changing the image and you can start downloading by clicking on the image. So if you change the href, different file would be downloaded. The problem of why it's not working is that the download attribute only works for same-origin URLs.

You can find the details here MDN Docs. Remember me. Not yet a member? Sign up Forgot password? Resend activation E-mail. Sign up. We've sent you an email. Click the link in the email to activate your account. Enter your email. Approach 1: Using Download attribute The download attribute simply uses an anchor tag to prepare the location of the file that needs to be downloaded. The name of the file can be set using the attribute value name, if not provided then the original filename will be used.

Example: Hey geek! The constant emerging technologies in the world of web development always keeps the excitement for this subject through the roof. But before you tackle the big projects, we suggest you start by learning the basics.

Now at it's lowest price ever! Approach 2: Using a custom javascript function firstly made a textarea where all the text input will be issued. The click method simulates a mouse-click on an element. You will notice that the GIFs are already loaded even though they are saved in the data-alt attribute. And the following is all the code you need to do so. The last piece of the code is where we bind each figure element that wraps the image with the click event. The code will swap the image source between the src attribute where the static image is served and the data-alt attribute where we initially serve the GIF image.

Please enable JavaScript in your browser to enjoy a better experience. The JavaScript First, we create a function that will retrieve the GIF image path we have put in the data-alt attribute. Image Pre-loading We now have a loading problem: with the GIF not yet loaded, there is a chance that the animated GIF would not play instantly since the browser would need a few seconds to fully load the GIF.