A few things. This is not a properly structured html document. It does not include a doctype, html, head or body tags.
It doesn't work at all in Firefox and is definitely in quirks mode. If you are going to work with CSS make sure you are working in standards mode, otherwise hair tends to get torn out. Table cells do not work the same as other items, however I would suggest making sure that the cell you are working with is given a height in pixels in javascript of the image you are working with. Make sure the image and the grid have margins and padding of 0. Sandy -----Original Message----- From: Joe Zanter [mailto:[EMAIL PROTECTED] Sent: Tuesday, February 01, 2005 8:43 AM To: CF-Community Subject: css image overlay Hi All, I come before you with no muffins, but with granola bars instead. Please don't throw them; I don't want injuries! (they may just be a bit on the heavy side and with shards of chocolate embedded) I have an app that kind of mostly works. It's for uploading and describing images of defects on parts. The feature I'm having trouble with is a grid overlay. The user browses for an image, it gets displayed and then they can select a grid to overlay on it to be able to give coordinates when they describe it features on the image. Problem. The grid get's overlayed, but it makes the cell twice as tall, like it overlays, but it also adds a placeholder underneath. Here's a link to the code below: <http://www.zanter.net/test/imageapp/image_app_grid_help.cfm> Here's the code. Maybe there's a better way to do this? ---------------------------------- <!--Add a js FUNCTION to display the image when the browsed path is displayed--> <script type="text/javascript"> <!-- //show the grid function showGrid(img, imgName) { var imgObj = document.images[imgName]; imgObj.src = img; } //display the browsed image function showImage(img, imgName) { var imgObj = document.images[imgName]; imgObj.src = 'file:///' + img; } // --> </script> <h2>Upload images</h2> <form name="imageupload" action="image_app.cfm" method="post" enctype="multipart/form-data"> <table border="3" style="font-weight:bold" align="center" cellpadding="3" cellspacing="4" bordercolor="#000080"> <tr align="center"> <td valign="middle"><span style="color:maroon">figure 1</span><br>click browse for filename: <br><input type="File" name="figure1_file" size="50" onchange="showImage(this.value, 'figure1_show')"> <br><br>caption:<br><textarea name="figure1_text" cols="50" rows="5"></textarea> <br>#descrmessage#<br> <h3>Select a grid color to overlay over the image.</h3> <select name="grid1" title="grid color" size="1" onchange="showGrid(this.value, 'figure1_grid')"> <option value="none">none</option> <option value="black_grid.gif">black</option> <option value="white_grid.gif">white</option> <option value="yellow_grid.gif">yellow</option> <option value="green_grid.gif">bright green</option> <option value="red_grid.gif">red</option> <option value="blue_grid.gif">blue</option> <option value="gray_grid.gif">gray</option> </select> </td> <td valign="middle"> <img src="preview_placeholder.jpg" name="figure1_show" width="500"> <img src="preview_placeholder.jpg" name="figure1_grid" width="500" style="position: relative; top: -375px; z-index:2"> </td> </tr> snip snip snip </table> </form> ---------------------------------- Joe -- Joe Zanter, Materials Lab, Woodward Aircraft Engine Systems 5001 North 2nd Street, Rockford IL 61125 ph 815-639-6312, fx 815-639-5104 mailto:[EMAIL PROTECTED] Re-inventing the wheel is ok if it didn't come out round the first time. *** The information in this e-mail is confidential and intended solely for the individual or entity to whom it is addressed. If you have received this e-mail in error, please notify the sender by return e-mail, delete this e-mail, and refrain from any disclosure or action based on the information. *** ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~| Find out how CFTicket can increase your company's customer support efficiency by 100% http://www.houseoffusion.com/banners/view.cfm?bannerid=49 Message: http://www.houseoffusion.com/lists.cfm/link=i:5:145701 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/5 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:5 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.5 Donations & Support: http://www.houseoffusion.com/tiny.cfm/54
