I need assistance in creating a code snippet that will automatically adjust the size of an image to fit the user's screen resolution. Additionally, I want to provide users with the option to toggle between viewing the actual image size and the adjusted image size for their resolution. Here is what I have been working on:
<img src="<?=$file['direct_url']?>" border="0" onload="if(this.width>screen.width/1.5) {this.width=screen.width/1.5;this.alt='Click image to view full size';}window.status=this.width;" onmouseover="if(this.alt) this.style.cursor='hand';" onclick="if (this.width=screen.width/1.5) {this.width=screen.width*1.5} else {this.width=screen.width/1.5}">
Any assistance or suggestions would be highly appreciated!