Hi James,
I think Joe's suggestion is what you are looking for. To be a little more
explicit, use a nested <div> where the outermost <div> is just wide enough
to hold 3 images. This will be your viewport. The inner <div> will hold all
of the images:
<style>
.viewport
{
width: 300px; /* wide enough to handle 3 images */
overflow: auto;
border: solid #000 1px;
}
.images
{
white-space: nowrap;
}
.prev
{
display: none;
}
.next
{
display: none;
}
</style>
</head>
<body>
<div class="prev"><a href="javascript:prev();" id="prev_action"><img
src="images/left-arrow" alt="scroll left" /></a></div>
<div class="viewport">
<div class="images">
<img src="images/image1.gif" />
<img src="images/image2.gif" />
...
<img src="images/image15.gif" />
</div>
</div>
<div class="next"><a href="javascript:next();" id="next_action"><img
src="images/right-arrow" alt="scroll right" /></a></div>
Then you could use a javascript window.onLoad function to set .viewport's
overflow to hidden and enable the prev and/or next functionality as
appropriate.
Best regards,
Kepler Gelotte
Neighbor Webmaster, Inc.
156 Normandy Dr., Piscataway, NJ 08854
www.neighborwebmaster.com
phone/fax: (732) 302-0904
________________________________________
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************BEGIN:VCARD
VERSION:2.1
N:Gelotte;Kepler;;Mr.
FN:Kepler Gelotte ([EMAIL PROTECTED])
ORG:Neighbor Webmaster
TITLE:Web Designer
TEL;WORK;VOICE:(732) 302-0904
TEL;WORK;FAX:(732) 302-0904
ADR;WORK:;;156 Normandy Dr;Piscataway;NJ;08854;United States of America
LABEL;WORK;ENCODING=QUOTED-PRINTABLE:156 Normandy Dr=0D=0APiscataway, NJ 08854=0D=0AUnited States of America
URL;WORK:http://www.neighborwebmaster.com
EMAIL;PREF;INTERNET:[EMAIL PROTECTED]
REV:20070415T052107Z
END:VCARD
