Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> img { width: 300px; height: 200px; } </style> <script src="https://code.jquery.com/jquery-3.5.0.min.js"> </script> </head> <body> <div class="imgDiv"> <img id="your-image" src='https://ru.w3docs.com/uploads/media/book_gallery/0001/02/c8d75681dcd87da6f7d8ebfa0cdb40cbb403bed8.png' alt="Image" /> </div> <script> $(document).ready(function() { $('img').on({ 'click': function() { let src = ($(this).attr('src') === 'https://ru.w3docs.com/uploads/media/book_gallery/0001/02/c8d75681dcd87da6f7d8ebfa0cdb40cbb403bed8.png') ? 'https://www.w3docs.com/uploads/media/book_gallery/0001/02/c4ba86c634f0f9c7ea055964c7f7436bab2bb698.png' : 'https://ru.w3docs.com/uploads/media/book_gallery/0001/02/c8d75681dcd87da6f7d8ebfa0cdb40cbb403bed8.png'; $(this).attr('src', src); } }); }); </script> </body> </html>