TechWhirl (TECHWR-L) is a resource for technical writing and technical communications professionals of all experience levels and in all industries to share their experiences and acquire information.
For two decades, technical communicators have turned to TechWhirl to ask and answer questions about the always-changing world of technical communications, such as tools, skills, career paths, methodologies, and emerging industries. The TechWhirl Archives and magazine, created for, by and about technical writers, offer a wealth of knowledge to everyone with an interest in any aspect of technical communications.
Subject:Re: Resizing GIFs for HTML? From:"Wing, Michael J" <mjwing -at- INGR -dot- COM> Date:Fri, 6 Mar 1998 13:09:45 -0600
> Whoa now, Mike...I hope this was merely a demonstration of a clever
> workaround, rather than a recommendation. I see some killer problems with
doing this in any volume. First off, it's impossible to do this for
hundreds of images in an HTML document. .
No, Tim, he simply said that he can't imagine how he'd do that in HTMl. I
don't see where he was talking about hundreds of images. He was talking
about a single schematic image. I showed him how to do it in HTML for a
single schematic image. What's the beef?
What 's so hard about doing it for hundreds of images? It's not impossible.
It takes some innovative thinking. Watch me!
First, lets change the subprocedure from being one image specific to being
any-image specific. Therefore, the subprocedures are increase() and
decrease.
Second, we no longer need the id tag for each image because all images will
be processed.
Third each image tag needs to call these procedures. Therefore, use a
replace function of a text editor (such as Edit pad) and do the following:
Replace <IMG
With <IMG onmouseover="increase()" onmouseout="decrease()"
Voila! all images will now double in size when the mouse is placed over any
image and decrease when the mouse is no longer over the image.
Here's the code.
=====================================================
<html>
<head>
<title>Test Zoom</title>
<meta>
<script language=VBScript>
sub increase()
Dim I, MyImg
Set MyImg = document.all.tags("IMG")
For I = 0 To document.all.tags("IMG").length -1
MyImg.Item(I).Width = MyImg.Item(I).Width*2
MyImg.Item(I).height = MyImg.Item(I).Width*2
Next
Set MyImg = Nothing
end sub
sub decrease()
Dim I, MyImg
Set MyImg = document.all.tags("IMG")
For I = 0 To document.all.tags("IMG").length -1
MyImg.Item(I).Width = MyImg.Item(I).Width/2
MyImg.Item(I).height = MyImg.Item(I).Width/2
Next
Set MyImg = Nothing
end sub
</script>
Second, change the subprocedure to accept an image
sub increase(MyImage)
MyImage.Width = MyImage.Width*2
MyImage.Height = MyImage.Height*2
end sub
The increase procedure now only processes the specified image (in this case,
Image1).
Second, it uses VBScript, something
that Netscape isn't really happy with and older browsers can't
handle
The same subprocedure can be done in Java or JavaScript. But, I have a
feeling you know that.
> Third and most importantly, GIFs aren't really scalable because they're
> bitmaps. Increase their size and you'll rapidly lose the image quality.
> Screen resolutions aren't ideal at the best of times and bitmaps only
> worsen the problem.
>
The issue as presented had nothing to do with image quality. It was that he
said that he could not imagine that HTML could not scale the picture. I
showed him that it can. You said that it could not be easily implemented
for hundreds of pictures. I have now showed you (above), that that's also
not true.
> I think what Mike Johnson was talking about was plots, which can be
> rescaled nicely even in PDF. Do the same in PDF with bitmapped schematics
> and you'll get jaggies. There isn't any comparable vector display for HTML
> at all, so the workaround isn't really practical unless you can tolerate a
> great deal of display degradation. Further, a B-size vector isn't as big
> (usually) as a B-size bitmap, which can, in full 24-bit color, easily be
> several meg in size.
>
Oh yeah! Where did he mention plots? I don't see it in his post!
> >>
> >> One thing I really like about PDF images is that they are scalable.
> You =
> >> can zoom in and really see the details - even on a laptop. It is a =
> >> great way to put B-sized schematics on line. I can't imagine how I'd
> do =
> >> that with HTML or anything else for that matter.
> >>
> >> Happy Friday from a snowy Salt Lake City!
> >>
> >> Mike Johnson
> >> OEC Medical Systems
> >> Michaelj -at- oecmed -dot- com
> >>
> >Ok, here's how. The following increases the size of the schematic GIF by
> a
> >factor of 1.5 every time it (the image) is clicked. It decreases the
> size
> >by a factor of 1.5 whenever the image is double-clicked.
> >
> ><img id="MyImage" src="Schematic.gif" alt="My Schematic" WIDTH="40"
> >HEIGHT="40">
> >
> ><script language=VBScript>
> >
> > Sub MyImage_onclick()
> > MyImage.Width = MyImage.Width * 1.5
> > MyImage.Height = MyImage.Height * 1.5
> > End Sub
> >
> > Sub MyImage_dblclick()
> > MyImage.Width = MyImage.Width */1.5
> > MyImage.Height = MyImage.Height / 1.5
> > End Sub
> >
> ></script>
> >
> >
> >Mike
>
MIke