[web] Bookmarklet - Replace Large Images
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 javascript 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 javascript.
This is how far I got:
<pre>var images = document.images;
var counter=0;
for (i=0;i<images.length;i++){
if (images<span style="font-weight:bold;">.width>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 onclick 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 onclick 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
Popular Topics
Advertisement