Nice photo gallery

[edoplaza]

Hi everybody,

 

Does anyone know how this photo gallery was made?:

 

http://ww w.hakanphotography.com/g alleries.htm

 

A client wants something like that (specially the scroll bar, which I hate, by the way). But the fact the images go one after the others, with no captions or title, I really like it.

 

Cheers,

 

Eduardo

[Wickham]

As far as the scrollbar is concerned, you can edit its width and colors with CSS for IE but for other browsers you have to use javascript. I agree that the plain gray scrollbar looks terrible.

 

The page has Flash files and object and nested embed code, but strangely they don't work in my Firefox even when I have enabled Javascript, so they are just plain images which I used the scrollbar to move.

 

I also noticed that the doctype is incomplete, it should have the url like this:-

/p>

"http://www.w3.org/TR/html4/loose.dtd">

 

but I'm not sure if that's why the Flash doesn't work for me.

 

Edit: I've had a closer look and the Flash is just for the text like "Order Prints". The images use a javascript array to place them in a long horizontal line, but I can't see why that can't be done with CSS.

Edited December 3, 2009 by Wickham

[edoplaza]

Hello again,

 

I finally found the js gallery I was looking for:

 

http://jquery fordesigners.com/slid er-gallery/

 

and adapted it to my needs:

 

http://www.pun tabahareque.com/s lideshow.html

 

Everything looks ok, except the little white gap between the pictures. I've been working with the css but I couldn't' find the problem. I've tried assigning 0 to all margins and paddings, but it doesn't work.

 

Thanks

 

Eduardo

[falkencreative]

If you add

 

.sliderGallery ul li img { float:left; }

 

that should fix your problem.

[edoplaza]

Hi,

 

I added your code, but look what happens:

 

http://w ww.puntabahareque.com/slideshow2.html

Edited December 8, 2009 by edoplaza

[edoplaza]

Hello again,

 

Well, I found a non elegant solution, but it works.

 

I deleted the float:left you suggested and added a margin-left: -5px

 

So, we have:

 

.sliderGallery ul li img {margin-left: -5px;}

 

You can see it here:

 

http://w ww.puntabahareque.com/slid eshow.html

 

Still, I'd like to know if there is a more professional o elegant solution, other than using negative margins.

 

Thanks again,

 

Eduardo