Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Ever increasing table width.

Reply
Thread Tools

Ever increasing table width.

 
 
Zeb
Guest
Posts: n/a
 
      09-14-2006
I've thrown together a basic javascript-driven gallery for a friend. It
uses onclick to show and hide table columns and to update the src of an
image. As you'll see by following the link below, the first column
holds a set of Gallery thumbnails, the second column holds a set of
Image thumbails and the third column holds the actual image.

http://www.zebrakorn.net/Gallery

Works great in IE, but Netscape and Firefox on Max OS are experiencing
a strange problem.

You'll see that gallery 3 has a lot more thumbnails, and I've achieved
the scrolling with a div tag that has overflow: auto and a set height.
Works great, but if you're using NS and you click on Gallery 3, a
mysterious gap appears between the second and third columns.

Continue to click on Gallery 2, Gallery 3, Gallery 2, Gallery 3 etc and
that gap will grow ever wider.

I'm assuming it's related to the scrollbar that appears. It's as though
it wides the table to accomodate the bar, but then does not decrease
the width when there is no bar. Most frustrating!

If needs be, I'll have to add prev / next links to the first and second
columns, but I'd rather not.

If anyone could shed some light on this I'd be most thankful.


Regards,

Matt

 
Reply With Quote
 
 
 
 
Jonathan N. Little
Guest
Posts: n/a
 
      09-14-2006
Zeb wrote:
> I've thrown together a basic javascript-driven gallery for a friend. It
> uses onclick to show and hide table columns and to update the src of an
> image. As you'll see by following the link below, the first column
> holds a set of Gallery thumbnails, the second column holds a set of
> Image thumbails and the third column holds the actual image.
>
> http://www.zebrakorn.net/Gallery
>
> Works great in IE, but Netscape and Firefox on Max OS are experiencing
> a strange problem.
>
> You'll see that gallery 3 has a lot more thumbnails, and I've achieved
> the scrolling with a div tag that has overflow: auto and a set height.
> Works great, but if you're using NS and you click on Gallery 3, a
> mysterious gap appears between the second and third columns.
>
> Continue to click on Gallery 2, Gallery 3, Gallery 2, Gallery 3 etc and
> that gap will grow ever wider.
>
> I'm assuming it's related to the scrollbar that appears. It's as though
> it wides the table to accomodate the bar, but then does not decrease
> the width when there is no bar. Most frustrating!
>
> If needs be, I'll have to add prev / next links to the first and second
> columns, but I'd rather not.
>
> If anyone could shed some light on this I'd be most thankful.


A tip, when things work oddly look for a error.


table cell "Gallery03" contains a DIV which has an invalid closing tag

"</div"

Rather than display and hide table cells "Gallery01"-"Gallery03" where
the browser has to recalculate the number of columns (I know the end
result stays static but your script does initialize by removing them
all) and put the three gallery DIVs within the 2nd TD and make them
"Gallery01"-"Gallery03". Better yet dump the table all together and have
3 separate DIVs with your lists of thumbs, float them left and if
viewport not wide enough instead of scrolling horizontally to see the
full-size image it will slip under the thumbnail selectors.


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
 
Zeb
Guest
Posts: n/a
 
      09-14-2006
Hi Jonathan

Thanks for the reply. I've corrected the (very silly) typo and it's
made no difference. Thanks for pointing it out though!

I like the sound of putting the three divs into a single table cell -
would certainly make things more simple and might cut down on table
layout problems. I'll give this a go and see what happens.

I'm less enthused by just using divs and no tables. I know it's the
correct way to do things - I'm just not quite as adept with div layouts
- and I know browsers tend to be less happy with them unless they're
done properly.

Jonathan N. Little wrote:
> Zeb wrote:
> > I've thrown together a basic javascript-driven gallery for a friend. It
> > uses onclick to show and hide table columns and to update the src of an
> > image. As you'll see by following the link below, the first column
> > holds a set of Gallery thumbnails, the second column holds a set of
> > Image thumbails and the third column holds the actual image.
> >
> > http://www.zebrakorn.net/Gallery
> >
> > Works great in IE, but Netscape and Firefox on Max OS are experiencing
> > a strange problem.
> >
> > You'll see that gallery 3 has a lot more thumbnails, and I've achieved
> > the scrolling with a div tag that has overflow: auto and a set height.
> > Works great, but if you're using NS and you click on Gallery 3, a
> > mysterious gap appears between the second and third columns.
> >
> > Continue to click on Gallery 2, Gallery 3, Gallery 2, Gallery 3 etc and
> > that gap will grow ever wider.
> >
> > I'm assuming it's related to the scrollbar that appears. It's as though
> > it wides the table to accomodate the bar, but then does not decrease
> > the width when there is no bar. Most frustrating!
> >
> > If needs be, I'll have to add prev / next links to the first and second
> > columns, but I'd rather not.
> >
> > If anyone could shed some light on this I'd be most thankful.

>
> A tip, when things work oddly look for a error.
>
>
> table cell "Gallery03" contains a DIV which has an invalid closing tag
>
> "</div"
>
> Rather than display and hide table cells "Gallery01"-"Gallery03" where
> the browser has to recalculate the number of columns (I know the end
> result stays static but your script does initialize by removing them
> all) and put the three gallery DIVs within the 2nd TD and make them
> "Gallery01"-"Gallery03". Better yet dump the table all together and have
> 3 separate DIVs with your lists of thumbs, float them left and if
> viewport not wide enough instead of scrolling horizontally to see the
> full-size image it will slip under the thumbnail selectors.
>
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIO
> http://www.LittleWorksStudio.com


 
Reply With Quote
 
Zeb
Guest
Posts: n/a
 
      09-16-2006
Thanks for the tip Jon. I went with three divs in a table cell and it
works fine now. I don't know why I didn't do it this way in the first
place!

Jonathan N. Little wrote:
> Zeb wrote:
> > I've thrown together a basic javascript-driven gallery for a friend. It
> > uses onclick to show and hide table columns and to update the src of an
> > image. As you'll see by following the link below, the first column
> > holds a set of Gallery thumbnails, the second column holds a set of
> > Image thumbails and the third column holds the actual image.
> >
> > http://www.zebrakorn.net/Gallery
> >
> > Works great in IE, but Netscape and Firefox on Max OS are experiencing
> > a strange problem.
> >
> > You'll see that gallery 3 has a lot more thumbnails, and I've achieved
> > the scrolling with a div tag that has overflow: auto and a set height.
> > Works great, but if you're using NS and you click on Gallery 3, a
> > mysterious gap appears between the second and third columns.
> >
> > Continue to click on Gallery 2, Gallery 3, Gallery 2, Gallery 3 etc and
> > that gap will grow ever wider.
> >
> > I'm assuming it's related to the scrollbar that appears. It's as though
> > it wides the table to accomodate the bar, but then does not decrease
> > the width when there is no bar. Most frustrating!
> >
> > If needs be, I'll have to add prev / next links to the first and second
> > columns, but I'd rather not.
> >
> > If anyone could shed some light on this I'd be most thankful.

>
> A tip, when things work oddly look for a error.
>
>
> table cell "Gallery03" contains a DIV which has an invalid closing tag
>
> "</div"
>
> Rather than display and hide table cells "Gallery01"-"Gallery03" where
> the browser has to recalculate the number of columns (I know the end
> result stays static but your script does initialize by removing them
> all) and put the three gallery DIVs within the 2nd TD and make them
> "Gallery01"-"Gallery03". Better yet dump the table all together and have
> 3 separate DIVs with your lists of thumbs, float them left and if
> viewport not wide enough instead of scrolling horizontally to see the
> full-size image it will slip under the thumbnail selectors.
>
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIO
> http://www.LittleWorksStudio.com


 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      09-16-2006
Zeb wrote:
> Thanks for the tip Jon. I went with three divs in a table cell and it
> works fine now. I don't know why I didn't do it this way in the first
> place!


Sometime when you are deep in a project you can get a little myopic. It
is normal.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Ever-increasing delay incurred when adding additional rows to a table Mr. Land Javascript 5 03-03-2008 05:32 PM
Table/table rows/table data tag question? Rio HTML 4 11-05-2004 08:11 AM
Increasing wireless network number =?Utf-8?B?c2FjaGlu?= Wireless Networking 2 09-03-2004 04:11 AM
don't you ever, don't you ever, lower yourself, forgetting all your standards Jason ASP .Net Web Controls 0 07-06-2004 12:50 PM
Could not load type VTFixup Table from assembly Invalid token in v-table fix-up table. David Williams ASP .Net 2 08-12-2003 07:55 AM



Advertisments