[web] Bookmarklet - Replace Large Images

Started by
-1 comments, last by Metroid48 15 years, 4 months ago
I'm a visitor of a forum that often contains extremely large images. This often makes it inconvenient to browse through the posts of a topic because my browser pauses to display each image. What I'd like to do is create a greasemonkey script - effectively an automatically executed &#106avascript file - that would replace each image larger than a certain width with a placeholder and add a button below it to set the image back to its initial source. Of course, no modifications can be made to the original web site html - it has to work via &#106avascript. This is how far I got: <pre>var images = document.images; var counter=0; for (i=0;i&lt;images.length;i++){ if (images<span style="font-weight:bold;">.width&gt;2000){ var OSrc = images<span style="font-weight:bold;">.src; images<span style="font-weight:bold;">.alt=images<span style="font-weight:bold;">.src; images<span style="font-weight:bold;">.src="http://www.google.ca/intl/en_ca/images/logo.gif"; var tempName="switch_" + counter; counter=counter+1; images<span style="font-weight:bold;">.id=tempName; images<span style="font-weight:bold;">.name=tempName; images<span style="font-weight:bold;">.onmousedown='alert("HI!");'//function () {var found=document.getElementByID(name);alert("Image clicked! Alt text is " + found.alt + "!");found.onclick="";found.src=found.alt;found.alt="";}' var newButton = document.createElement("button"); newButton.appendChild(document.createTextNode("Show Image")); addEvent(newButton,"click",showImage(tempName,"")); document.insertBefore(newButton,images<span style="font-weight:bold;">); } } function showImage(name,OSrc){ var found=document.getElementByID(name); alert("Image clicked! Alt text is " + found.alt + "!"); found.onclick=""; found.src=found.alt; found.alt=""; }</pre> As you can see, I was trying several methods of making something clickable. I tried giving the image an &#111;nclick function but couldn't get it to execute (no alert message). I tried adding a button just below the image but failed in that regard too. Anything I'm doing wrong with getting a button to appear, or make the image have an &#111;nclick attribute? I know the script is executing as the images are all replace with the Google logo (a placeholder). Thanks, -metroid48

This topic is closed to new replies.

Advertisement