PDA

View Full Version : Image Thumbnail Viewer Gecko bug fix



Frank2056
05-22-2005, 09:34 AM
As posted, the otherwise excellent Image Thumbnail Viewer has a bug that only affects Netscape/Mozilla/Firefox based browsers. When an image window first pops up, the dragbar doesn't fully extend the width of the image. Subsequent calls cause the dragbar to extend as expected.

The bug happens when this line of js is called to draw the dragebar:

crossobj.innerHTML='<div align="right" id="dragbar"><span id="closetext" onClick="closepreview()">Close</span> </div><img src="'+which+'">'

The fix is pretty simple - give the dragbar a non-zero width. The fix is highlighted below:

crossobj.innerHTML='<div dragbar width: 1px> <div align="left" id="dragbar"> <span id="closetext" onClick="closepreview()">Close</span> </div> <img src="'+which+'">'

The CSS can remain the same, although this:

#dragbar{
cursor: hand;
cursor: pointer;
background-color: #EFEFEF;
min-width: 100px; /*NS6 style to overcome bug*/
}

can now be simplified to:

#dragbar{
cursor: hand;
cursor: pointer;
background-color: #EFEFEF;
}

The dragbar now extends the full width of the image the first time and every time for all browsers (at least IE, and Gecko based browsers). Works fine on PCs and Macs as well, including Safari.

Frank

jscheuer1
05-22-2005, 10:21 AM
<div dragbar width: 1px>Either this is a typo or I missed that day at hack school. Unless, as I say, I'm missing something, the only browser that will interpret this as a width is possibly IE. The id will not be applied as, no id= prefix is used. It is uncertain which, if any, browsers will see it as the opening tag for a division however, I see no closing tag. If this fixes anything, it is probably just luck. Did you mean either of these?
<div id="dragbar" width="1">or
<div id="dragbar" style="width:1px">

Frank2056
05-23-2005, 04:30 AM
Either this is a typo or I missed that day at hack school....

Did you mean either of these?
<div id="dragbar" width="1">or
<div id="dragbar" style="width:1px">

Actually, it's a typo, and I copied it from a local test .js file, and not the working version from my page.


<div id="dragbar" width="1">
is what I meant.

Oddly,

<div id="dragbar" style="width:1px"> doesn't work.

Surprisingly, the typo itself also works, although without a border around the image. Go figure.

Thanks for pointing it out.

Frank