Thanks Thorsten - but I was hoping I wouldn't have to use maths but instead
utilise some kind of 'width:auto;' thing or a <noWrap> thing or something
inherently set by the technology. If wost comes to worse, I'll just pop in
some client-side JS to do the math - but i still think it's a bit of an icky
option....
:o)
r
----- Original Message -----
From: "Thorsten" <[EMAIL PROTECTED]>
To: <[EMAIL PROTECTED]>
Sent: Tuesday, September 07, 2004 4:55 PM
Subject: Re: [WSG] Horizontal Scroll
ji Richard,
> Umm actually thinking of a container "x" pixels long that I can hold
> images in so that they can be scrolled horizontally. This is the kind
> of effect acheived in Flash with only a little effort but in CSS?
if you use "overflow:scroll;" you'll get BOTH scrollbars, but in order
to get the desired horizontal-only scrollbar, "overflow:auto;" seems to
be the better choice to me.
> At the moment, I'm using the following code:
>
> <div style="display: block; width: 692px; height: 110px; overflow:
> scroll; overflow-y: hidden ! important;"> <div style="width:
> 3000px;"><!-- this width is the total width of all objects in the
> conatiner-->
>
> <a href="javascript:SwapPic('galleryLrg01.jpg')"><img
> src="images/gallerySml01.jpg" width="100" height="100" border="0"
> alt="" /></a> <a href="javascript:SwapPic('galleryLrg02.jpg')"><img
> src="images/gallerySml02.jpg" width="100" height="100" border="0"
> alt="" /></a> <a href="javascript:SwapPic('galleryLrg03.jpg')"><img
> src="images/gallerySml03.jpg" width="100" height="100" border="0"
> alt="" /></a> <a href="javascript:SwapPic('galleryLrg04.jpg')"><img
> src="images/gallerySml04.jpg" width="100" height="100" border="0"
> alt="" /></a> etc...
>
> </div> </div>
>
>
> yick! a second almost usefuless nested <div> tag! Also, If I want to
> populate this dynamically, then I'm going to have to work out the
> total width of all the scrolling objects each time! How can I get rid
> of this?
if you want a fixed-width container, say 692x110px (which fits into your
design/page proportions) and have the image gallery scroll inside it,
you'll NEED the div holding the pictures with a width of say 3000px all
in all. otherwise the gallery would expand the whole browser
window/frame/whatever to the right. if this is the desired effect and
you WANT the whole browser page to scroll, it should work with only one div.
i'm not the smartest programmer around, but with php for example you
should be able to simply multiply the number of pictures with their
(standardised?) width. if you don't have a standardised width, the math
should not become exceedingly complicated, only a bit more elaborate:
-> add width of picture 1 to width of picture 2 to width of picture n,
take into account padding between pictures.
again, this is more of a layman's attempt at it, others feel free to
bash me senseless with better approaches, i always like to learn!
- Thorsten
******************************************************
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
******************************************************
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
