Question
I've been working on web pages this week, so I haven't been posting much. One thing I've done that I thought others might like to borrow is this drop shadow adapted to a table.
I actually started out using Microsoft's filters with the gradient option, but decided it was way too much trouble--and probably a heavier load on the browser than the small images needed to do it this way. At least I learned something playing with the filters, even if I ended up using the old-fashioned method.
Here's an example: http://216.92.199.248/shadow/sample.html
The red box is a one-cell simple table. You can adjust this to fit any table simply by adding colspan and rowspan options to the drop shadow cells. You can also adjust the width and height of the shadow images to fit the proportions of your table.
Here's the code:
HTML Code:
<table cellpadding=0 cellspacing=0 border=0>
<tr><td bgcolor="red" align="center" valign="middle"><br>Insert your table here.<br>
<img src="cgspacer.gif" width="200" height="200" alt="placeholder - delete this image"></td>
<td background="side.gif" valign="top" width=10><img src="whitespacer.jpg" width=10 height=8><br>
</td></tr>
<tr>
<td valign="top" align="left" background="bottom.gif" height=10><img src="whitespacer.jpg" width=8 height=10><br>
</td>
<td><img src="corner.gif" width="10" height="10" alt=""><br>
</td>
</tr>
</table>
Right-click and choose "Save target as" to get the images from these links.
http://216.92.199.248/shadow/bottom.gif
http://216.92.199.248/shadow/side.gif
http://216.92.199.248/shadow/corner.gif
http://216.92.199.248/shadow/whitespacer.jpg
Answer
NEATO!
I didn't know you could do that! (learned my something new today already lol)
I am going to have to use this in a few places.... I think it adds something special to the page.
Thanks Jayne
Answer
That IS neat!
Now, is there any way of doing that in PSP-8 instead of using tables?
My website doesn't play well with tables.
Answer
To do it in PSP8, open the image you want to shadow. Copy it, either with Edit-> Copy or Cntrl-C.
Use File->New to make a new image. Size it about 20px larger than the other image. Use the background color you need for your web page.
Making sure the new image is active, click Edit->Paste as a New Selection.
Center the pasted image.
Choose Effects->3D Effects->Drop Shadow.
Crop the new image to size, being careful not to cut off the shadow.
__________________
On the images I posted above, the page background has to be white. (Drop Shadows don't do well with transparency.) If your page background is a different color, you can make your own images with PSP8. Just set the foreground color to black and the background color to the web page color. Then use gradient option. Shrink to the size you need.
The only sticky part is the small lower right corner, when the shadow comes to a point. You have to finagle that one. What I do is basically a gradient one direction, then a little judicious Flood Fill and some hand editing. There's probably an easier way, but I haven't found it yet.
Answer
Since all of my websites have a non-standard background pattern, that's just TOO much darned work. I thought maybe there was a 'gizmo' (like the 'border') in PSP8 to do that with photos. What you've described is, to me, just way too much work!
Took me forever the other day using Animation Shop III just to get a photo transparent. (clicking over each and every 'box' <pixel>. )
But I'll keep those instructions just the same.
One NEVER knows when they'll come in handy.
THANKS for posting them!