Mobile Friendly Website

CSSPLAY

Doing it with style

photo gallery v2 COMMENTS

Welcome to my Comments Pages

Please note. I get a few hundred emails a week from visitors asking for help, or posing questions on how to modify my demos to suit their application and I read them all. Unfortunately I only have a limited amount of time to spend answering these questions.

So if I do not reply, please do not be offended, and if I do reply then you are one of the lucky ones.

If you are asking for permission to use any of my demonstration then please email me with your request stu{at}cssplay.co.uk.

Post a comment


Current posts

Brian Li:-
"Simply Amazing"

You are a CSS guru in my book. Speaking of books, ever think of writing one?
(15.10.2004, 17:12)

Stu:-
Wrote a couple of books on Z80 machine code programming for the Spectrum back in the 80s (when I was young). But at 58 I am a bit too ancient to contemplate such a task again. Anyway there are a lot of good css books about at the moment and from what I read there is another one coming shortly.
(15.10.2004, 17:47)

JP Hingamp:-
Such good taste deserves more praise than I can possibly express.
(03.11.2004, 00:57)

Rozi:-
are you crazy man? :)))))) yet i dont feel like real man $-)
(14.12.2004, 19:39)

cAs:-
IE 6.0 - Selection does not hold while scrolling. When an image is selected, an image prior to it cannot be selected

FireFox 0.9 - Same thing, but scrolling does not de-select.

I will see if there is any alternative...
(21.01.2005, 03:53)

Stu:-
cAs, this gallery is a demo of what is possible. In FF a previous image can be selected (clicked) but the hover state does not work. For a working gallery I would use EITHER the hover OR the click to select an image (and have an instruction to this effect). Personally I would choose the hover as it is quicker, easier to do in css and works in most browsers.
(21.01.2005, 08:34)

prophotodx:-
Hi Stu, I would love to use this gallery, two questions, how do I get a clean copy of the code and script, and why doesn't the HTML verify??
(11.03.2005, 02:09)

Stu:-
prophotodx, the best way to get a 'clean copy' is to copy the page html and strip out the surrounding information to leave the css and photo div. The page doen't validate because I have made an error in one of the titles. I have used a capital T for Title when it should have been t for title (case does matter). I will correct this as soon as I can.
(11.03.2005, 08:14)

Stu:-
once more valid xhtml1.1 ;o)
(11.03.2005, 20:28)

Max Jackson:-
Stu, if I could draw a picture of your design it would be Bruce Lee in the cock-pit of a stealth bomber (filled with bunnies instead of bombs of course). Seriously, I've been chewing on your portfolio II code for weeks and I can't figure out how mimic a design where a text title appears with the selected photo. Heck, my literature doesn't even cover your:

.gallery:hover img, a.gallery:active img, a.gallery:focus img

...style. I'm having to order new books to decipher and utilize that stuff (2 or 3 whatever it is). Do you have any ideas for resources that I might check out. Any help of course would be super groovy.
Cheers.
-max
(21.03.2005, 02:57)

John:-
I'm trying to customise this gallery so that the full-sized images appear in a <div> in a separate column from the links/thumbnails (ie links in left column, pix in right column). Everything's fine except for the use of the default image - it obscures the rollovers. I'm thinking the bit that might affect it is the div#info cos it's the only bit I'm not using cos I can't in my situation. So how would you work around it?
Thanks
John
(22.04.2005, 03:29)

drifter:-
Hi Stu,
I'm new to CSS and I find your website very informative. Anyhow, I have a question about a css line from your scroll gallery. What is this line for?
a.gallery span {display:block; position:absolute; left:150px; top:-1px; width:1px; height:1px; overflow:hidden; background:#efedec;}

I played around with the code using my images and gallery. When I changed the "left" offset to a smaller or larger pixel number, nothing changed on my page. Also tried changing the color, and when that happened, I noticed a green border that sometimes appear around my larger image. Still I don't really know what this line of code does, so any clarification would be great. Thanks.
(22.04.2005, 22:39)

Stu:-
This style creates a 1 pixel by 1 pixel block to hold the images before they are displayed fully. Depending on the value of left and top you may see a single black pixel on the screen. The background color does not really matter much. The purpose of this is to preload the images but not 'display' them on the screen. changing the 1px values will diplay more of the photographs. Try changing the width and height to 100px and see what happens.
(22.04.2005, 22:50)

drifter:-
Thanks Stu.
I have a couple problems now, in Firefox the default image still appears on top of the hovering images. And then in IE, there is a horizontal scroll bar when it is unnecessary. I read somewhere that the horizontal bar may appear when there is a vertical scroll bar on the page, which is true in my case. Any ideas on the fix? Thanks in advance.
(25.04.2005, 23:03)

Stu:-
It is hard to say what the problem is without seeing it. Do you have a url for your gallery?
(25.04.2005, 23:12)

drifter:-
www.200northdearborn.com/main.htm
The problem is on the one-bedroom apartments page. Click on apartments on the left panel, then choose one bedroom up on the top. I did not create this webpage, was just asked to insert pictures of one bedroom apartments. I came across your image gallery while browsing css stuff and thought it was neat, so I added the gallery to the page. Sorry for not obtaining your permission beforehand, is it okay? Other than that, it seems be a very boring static page.
(26.04.2005, 21:42)

Stu:-
drifter, I have had a quick look at your page (which looks ok in IE6 except for the small vertical scroll bar on the thumbnails). FF however has a problem with the initial image staying on screen. This is probably due to the other absolute positioned divs on the page and maybe because it is in a frame.
Try putting the gallery and style on a separate page to see if it works there. If it does then put it into the frame without any other divs. If it still works then introduce other content until you find what breaks it.
(26.04.2005, 23:03)

John:-
Hi Stu, any ideas on my question on how to split the large image and thumbnails into two separate divs (as posted above)?
(27.04.2005, 23:46)

Stu:-
John, you will need an outer containing div which has a relative position in order to position the default image correctly.
(28.04.2005, 08:00)

mrruben5:-
Line 61.



space...
(23.05.2005, 21:12)

Stu:-
Doesn't affect anything, but now corrected.
(23.05.2005, 22:11)

Jess:-
Hi Stu,
this gallery is failing to work in Opera 8.0, the previous one worked fine however. (running on Windows)
(30.05.2005, 09:30)

Stu:-
Jess, I did not include Opera in the list of working browsers.
(30.05.2005, 10:53)

silver13:-
If you can do the Beatles image map with text pops and the Streaker and the Photo Gallery MK II individually, I'd believe you could combine them to do a photo image gallery without a draggable scroll-bar; but, instead, a seemingly moving scroll-bar with hover that pops images and text descriptions. What do you think?
(27.06.2005, 18:40)

Mike:-
Is there a way to do this with a vertical scrollbar parallel to the images by resizing and repositioning the containers? I never seem to get the desired effect.
(12.08.2005, 20:23)

abb:-
fails in opera 8.1 Win =(
(30.08.2005, 18:55)

Stu:-
abb, I have not included Opera in my list of 'working' browsers. I don't think that Opera will ever get this one right as it hasn't worked from my original testing with Opera 7+
(30.08.2005, 19:17)

franck:-
Hi stu, excuse my english because i'm fench,
your gallery does not working on Netscape 7.0
The image on the .SlidK are Staying all the time , when you pass your mousse on the image of the thunbail scrolling, you can see that on your own web site. I tried to put Z index on the css code, but it's not working
Could you help please

thank's for your beautifull image galleries
(18.09.2005, 11:02)

Lex:-
Hi Stu, I'm new to CSS and think your site is amazing! - If you don't mind I'd like to use your "photo gallery Mk2" on my website please. I've managed to adapt it so that the scroll bar is longer than th large photo displayed - but I can't get the pheoto to be centered. I can move the images around but if I re-size the browser they all go out of alginment. Is it possible to move both the background image and the one that appears when you click/hover so that they line up centrally over the scroll bar? Thanks - Lex
(10.10.2005, 10:24)

Stu:-
Lex, you can use this method as you like. The position of the images is controlled by the value of 'left' in the css in a.gallery:hover span, a.gallery:active span, a.gallery:focus span
(10.10.2005, 18:13)

Eric:-
This doesn't work in Firefox 1.5 Beta 2 on a Macintosh (Mac OS X 10.4.2). The text describing the small image appears, but the large image doesn't display.
(18.10.2005, 21:56)

jorge:-
hey stu, been playing with photo gallery mk2... took just the markup and css from the page itself. it works beautifully in firefox but in ie6, the full size image in the span shows up in the div 'scrollbox'... is there any markup/styles that speak to ie only?
(20.11.2005, 20:45)

Stu:-
jorge, are you using the correct doctype?
(20.11.2005, 21:12)

jorge:-
duh! you're a genius, stu. really! if only opera played along...
(22.11.2005, 04:16)

Jann:-
Hi Everyone,
RE: Firefox 1.5 breaking the default pic

I've gotten some marginal success with putting the default pic as a background image in the "#photos" id. I need to fool around with the width / height because the default pic is getting cut-off somehow... but thought I'd share what I found out so far.
(02.12.2005, 22:32)

Jann:-
RE: Firefox 1.5 breaking the default pic;

I was able to get mine working. You can take a look at http://www.jamaicayes.org/gallery_070105_St_Theresa_Basic.htm

BTW: I've only tested in IE6 - FF1.5 - NS7.2
(02.12.2005, 23:35)

Vin:-
How can i add a default image to this css? It doesnt say much without one.
(06.12.2005, 18:49)

Stu:-
Vin, default image restored with a simple workaround.
(06.12.2005, 20:40)

Travis:-
I've copied the code and the Image appears inside the scroll bar when I role over it. I mean, it is 1:00 in the morning maybe thats why i cant figure it out...how would I get the picture out of the scroll bar where the thumbnails are and put it where it should be...
(18.01.2006, 06:20)

Stu:-
Travis, check that you have position:relative; and position:absolute; where applicable. Including the outer containing div (#info).
(18.01.2006, 08:26)

simon@oneofas.co.uk:-
I love this menu and its exactly what I have been looking for but I am a css novice and would like to know how to get this working on my site can anyone help?
(23.02.2006, 07:15)

Me:-
Peace, all!

Bug?
Breakage in Konqueror (v3.4): the thumbnails appear with an horizontal scrollbar, which when scrolled, causes the position of the enlarged photo to shift left by the same amount.

(I have a screenshot but cannot attach it here. Duh.)

Can anyone explain how this happens? (Looks like a bug in Konqui which I'd like to have reported.)

Thanks!
(o;
(02.04.2006, 16:20)

Stu:-
Me, the thumbnails are placed in a horizontal scrolling div. Opera has a problem with this, so I expect that Konqueror is also not able to interpret the css as I want.
Links are only allowed beginning with www not http
and will not be searched by Google etc.
(02.04.2006, 16:45)

Zac:-
Is there a way to make the "ANOTHER PHOTOGRAPH GALLERY" and protect the images from being downloaded like make them backgroun images?
(22.04.2006, 21:16)

Stu:-
Zac, there is always a way and using background images is one of them.
(22.04.2006, 21:38)

Julian:-
Hi Stu!!!
That is just great stuff on your page. I'm impressed and I learnt a lot from your examples. I copied your Photo Gallery V2 'cause it was exactly was I was looking for! :)

I had several troubles concering (position:absolute or relative...), but finally it works but unfortunately only in FF (1.5). The images just don't appear in IE 6 :(
There obviously must be some mistake hidden somewhere. I'm now sort of lost and would be really happy if you could have a read through my source text and whatever...Thanx
(27.04.2006, 08:10)

Hadi:-
Hi Stu, thanks for the masterful image gallery.
I got it working pretty well in IE, apart from what cAs mentioned too.
However i have a prob with the default image in FF, its not showing up and cramping up the page.
Any advice?
(08.05.2006, 04:52)

Anonym:-
Stu you had the instructions for a photo gallery a few months ago that featured pictures of dogs. Could you email me those instructions. I am very inspired by your work and want to learn CSS. Thank you Howard
hsparks@kc.rr.com
(09.05.2006, 05:10)

Stu:-
Howard, the tutorial is now on this site and can be found here www.cssplay.co.uk/articles/gallery/index.html
The link is on my first photo gallery page.
(09.05.2006, 23:09)

Andy:-
Stu seems like when the default image position is set to relative it fails to show the image properly in Mozilla 1.5.
- for me anyway.
Have you come accross this. I tried your doctype (dont know if that would have anything to do with it in the first place) but to no avail.
- Andy
(10.05.2006, 06:19)

Hadi:-
Andy i had the same problem and i just solved it.
I removed the hight and size values from from the #info div working fine now in FF and IE. Mind you mine is sitting within a table.
(10.05.2006, 06:49)

alyssa:-
i'm using the photo gallery mk II.. and i can't figure out how to align the photos with the left side of my design (www.pumaboards.com/blargphotos.html). any ideas?
(16.05.2006, 04:12)

Youri:-
Hey Stu, awesome site, I've been dabbling in css for a while, and your site is an great source of inspiration.

Anyways, enough sucking up:P Perhaps you could help me out. I've made an image gallery using your 'a dog's life' tutorial, and it works just fine. Only what I really want is to have the hover effect and also have the active/focus effect that keeps the image on screen untill I hover over another thumbnail. I see that this is possible in some of your other galleries but I can't figure out how. Perhaps you could shed some light? Does the secret lie in the active/focus or am I missing something totally different.

Thnx in advance
(17.05.2006, 09:13)

redice:-
hi,

cant seem to find the tutorial for this gallery. please help
(15.06.2006, 11:36)

Thankful:-
If it wasn't addressed already, in the code there appears to be an extra div for slidek which I believe is unnecessary.
(13.07.2006, 13:31)

Thankful:-
Aha. I knew I wasn't crazy. This demo does not work in Opera 9. I was building something new which relied on your gallery as inspiration, but I noticed objects are not positioned truly absolute, but relative to the scrollbar. Very interesting! A bug in Opera or something missing from the code?
(27.07.2006, 16:50)

Rainer Rogatzki:-
hello stu,

really a smooth piece of art again! :O)

unfortunately it doesn't seem to work with the following browsers:

Opera 8.54
Netscape 7.1

The thumbs don't show in their normal size. Neither on hover, active, focus. :O(

IE 6.0 and Firefox 1.5 work really fine!

Got an idea?

I'd be most thankful for any clue.

Greetings
Rainer
(rainer.rogatzki@web.de)
(14.08.2006, 10:54)

Maui Tech Girl:-
Three questions...
1. How do I add in code to change the color of the scroll bar?
2. How do I move the gallery frame to the left side of the page?
3. Can this be used in frames, i.e. controller looks for the css page and puts it together with the other pages?
(18.08.2006, 10:21)

charlotte:-
how do you copy the css and do you put it in a seperate file sheet and if so how do you link it out??
(20.08.2006, 11:06)

charlotte:-
please help need to know how to get the css code for the image gallery at least????
(20.08.2006, 11:07)

charlotte:-
how do you get the ccs code?
(20.08.2006, 11:08)

charlotte:-
where do you get the css code???
(20.08.2006, 11:10)

Stu:-
charlotte, I am not sat by my PC 24 hours a day. One question would have been enough but I normally take a day or two to answer. In order to use and adapt this gallery you will need to know about css. You can find the xhtml in the source code within the div id="info" and the css is in the head of the code. This can be put in a separate stylesheet and linked in the usual way if you wanted or left in the page head.
(20.08.2006, 11:53)

charlotte payan-salcedo:-
okay, stu sorry bout that I am a graphic design major, they dont want to teach us css but i am eager to learn, I know that you can get the css by cutting and pasting into the browser window. I am stuck on getting the right code. best example is to take an example source code and highlihght "the exact path i should put into the browser" Ive tried basically every string of code and put it in the browser it doesnt work. When it works a window should pop uo allowing you to download the css. but it never works???? why? please highlight the exact path.
(20.08.2006, 21:25)

Stu:-
charlotte, ok just this once. But you really should get a basic understanding of css to be able to adapt any of these examples.
Firstly you will need a standards compliant doctype (that's the first line of the source code) w3.org can supply several doctypes that are standards compliant or just copy mine.
The source code for the gallery is in the <div id="info"> ...... </div> and begins <div id="holder"> and ends </div></div>
The style is in the <head> of the page and includes everything between the <style type="text/css"> and the </style>
So copy the xhtml into the <body> of your page and the style into the <head> of your page and make sure that the path to your photographs is correct and it should work in IE6, Firefox and Mozilla.
(20.08.2006, 22:22)

Tim:-
Stu,
The photo gallery v2 looks great in IE 6.0. Do you have any suggestions to make it work with the CSS support changes in IE 7.0 (Release Candidate 1 being the latest version available)?
(28.08.2006, 22:27)

Stu:-
Tim, I have not tested any of my demos in IE7 so cannot comment on this one yet. BTW does IE7 RC1 overwrite IE6 or can they exist together?
(28.08.2006, 22:42)

Lord Arse:-
IE7 overwrites IE6 but it can be uninstalled leaving IE6 intact.
(04.09.2006, 01:31)

charlotte payan-salcedo:-
FYI Stu- you copy the graphics and then you go into the code and take the file path and put it in the browser window. i just hacked your whole site.
(04.09.2006, 06:54)

Daryn:-
I have created a gallery simmilar to yours, but I have the thumbnails to the left of the photo, stacked vertically. It works great, except when I scroll through the thumbnails, the photo scrolls also. Is there a way to fix the photo on the page?
(13.09.2006, 05:19)

Stu:-
IE7 RC1 has a problem with this one. I think it needs a trigger to display the large image.
If you click one of the thumbnails then click the IE7 'previous' button to take you back to a previous page, then click the IE7 'next' button to bring you back to the gallery you will find your selected image displayed.
This needs further investigation.
(26.09.2006, 10:40)

Stu:-
A fix for IE7 coming soon.....
(26.09.2006, 15:57)

Stu:-
IE7 fixed
(27.09.2006, 10:00)

Esben:-
Thanks for a great and inspiring site!
I've got a small problem, though. This gallery only (almost) works when I remove "Transitional" and start the code with <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN">. But that interferes with table cell sizes in IE6. In Firefox the cells are ok, but instead the large images aren't top aligned in the cell as they should be. How do I fix this?
(27.09.2006, 10:05)

Stu:-
Esben, you will need a 'standards compliant' doctype for this to work. Removing the 'Transitional' throws IE into 'quirks mode' with the faulty box model.
For a list of acceptable doctypes see the w3.org web site (search for 'doctype')
(27.09.2006, 14:38)

Tomas - IWD:-
hi Stu,
An avid fan of yours here again. What exactly are you changing for IE7? I'm looking at the code, I've styled the gallery so that the scrollbox is now to the left and the picture is to the right.can send you the link if you want.
I've checked on IE7 and I got it working.
I've left your code:
a.gallery span {display:block; position:absolute; width:402px; height:280px; top:0px; left:-99999px;z-index:100;}

can you explain why you use left:-9999px?
(06.10.2006, 11:53)

Stu:-
The left:-99999px; is used to place the full size images off the screen. This is the only way I found to make IE7 and IE6 work. Using display:none; or visibility:hidden; does not quite work with both :hover and :active/:focus.
(08.10.2006, 15:52)

Powermic:-
Some problems with image placing while aftre scrolling in Opera
(20.10.2006, 16:48)

Stu:-
Powermic, I do not claim that this one works in Opera, and as you have found out, it doesn't.
(20.10.2006, 17:35)

Lee:-
Hey Stu, great work! I'm trying to get this to work, so I can also link the text to another page, separate from the thumbs. I'd like the thumbs to be able to hold focus, and then either click full-sized image or text to go to a full story. any ideas? thanks! Lee
(27.10.2006, 00:04)

Zipotron:-
HI, i would like to generate a list of link with the names of the thumbnails as a combo like drop down and the link must activate the big photo corresponding to the link. It's this posible?
(04.11.2006, 04:47)

Zipotron:-
Hi again, i have thinking of what i had writen and i'm not shure you can understand me without the context, than here it is: projet.awardspace.com/produits.php?langue=eng
The thing is i found a script to dynamicaly change a combobox if the user click on a tab here: www.javascriptkit.com/script/script2/multicombo.shtml
but i must place the combobox on the top (to have a list of model 'cause over on everyone it's a pain), can i still use it to change the big picture? or i have to place it near the scrollbox?

Thank !
(06.11.2006, 17:35)

Stu:-
Zipotron, the only way that this would be possible is to use a dropdown menu similar to www.cssplay.co.uk/menus/drop_definition.html which could be populated in the same way as a combo box.
This would then link to the image required.
(06.11.2006, 17:49)

Mike:-
firstly, thank you for a truly inspiring site...awesome

my question is can the load order be changed. it loads the large images first and THEN the thumbnails... hence if you have a big gallery it takes ages to load the thumbnails.

any way to get thumbnails first ????
(07.11.2006, 05:26)

Zipotron:-
Thank Stu, than if the list of item in the dropdown menu is big can it have a scrollbar in it like a combobox?
(09.11.2006, 07:49)

Bruno:-
Hi Stu,
great page and great examples.
Question of a CSS newbie: I changed the size of the thumbnails and of the hovered images and took some paddings out to save space - everything works fine.
But I have problems with the fixed / clicked image. Hover right: hovered images change accordingly, text overlays text of fixed image. Hover left: fixed image stays in the box, text overlays text of fixed image.
I can´t find the solution - can you help please?
(07.12.2006, 11:13)

Bruno:-
Hi Stu,

I could solve my problem with the fixed image by myself - sorry for asking you too early.
But maybe you can help to solve the next problem:
I want to place the whole gallery centered in the middle column of a 3 columns layout. How can I achieve this?
(07.12.2006, 16:20)

Bruno:-
Hi Stu,

I´m back again asking you for a christmas favour ;-).

I want to use an image gallery with several different sets of images on different pages of my site. The sets contain landscape and portrait images and the number of images differs from set to set. This galery vs. 2 seems to fit best to my requirements but it is a little bit cumbersome to set up the pages and the handling of the thumb images is also difficult for the user especially when you have to show more than 30 images for example.

Could you find a solution which is independent of the number of images and which works for landscape and portrait images?
(20.12.2006, 11:43)

Nathan:-
Stu,

I really like what your doing here on your site and I'm really stoked on this feature. I was wondering how to manipulate this code for a cobranding format through smugmug,a photo hosting site. A gentleman by the name of Andy at www.moonriverphotography.com/gallery/729350 has this layout on his links page. We both have the same photo hosting site that has a section for css, java, header, footer, body tag and head tag.

I ahve set up all the code but I dont know how to up load a txt page of the code for you to see where I might have gone wrong. My site is www.opticaltranquility.com.

This code is way to advanced for the forum pros on www.Dgrin.com which by the way gives your site a lot of traffic, that is how I found you!

Hope you can help and if there is anything I can provide please let me know and Thanks for your time and efforts!!!
(04.01.2007, 20:36)

Dave:-
Hi Stu,

I've managed to integrate this gallery into an existing page, but for some reason I can't get the #holder pic to appear. It's obviously conflicting with something else on the page but I just can't find it. Your learned eye would be much appreciated:

ddjacobs.110mb.com/reubenpics.html

It's still in development, but I think you can see what I'm doing with it.

Many thanks,

Dave
(24.02.2007, 03:09)

Steve:-
Love your photo galleries Stu, this a fantastic site Well done! I do find though that trying to have the same look and functionality in IE makes for time consuming practises, if only it dispalyed like Firefox! I tried your IE hacks but I have a similar problem to Dave ^
(26.02.2007, 00:10)

Steve:-
Sometimes I can be a fool! <MOST important don't forget the right !DOCTYPE> it makes the world of difference when using IE, I added the correct !DOCTYPE and va-la it works, thanks again Stu wonderful work!
You can check the gallery out at <www.marklin.org.nz/sig_construct_gallery.html>
if you feel the need to.
(26.02.2007, 03:34)

Roman:-
is there a way to fix the porblem that when you move the scrollbar in ie than the selected image disappears?
(02.03.2007, 12:02)

Jefke:-
Hello,

I'm trying to use this gallerie and everything went fine... Now i'm having a problem that i can't solve. Struggling for 2 days now.

I've put the gallerie in a 100% width div and can't get the gallerie centered for every screen resolution. I changed the left position in % instead of px but no result.

Can someone help me with this problem please?

Many thanks for sharing the gallerie!
(23.07.2007, 10:15)

Steve:-
Hi Stu,

Great demos! Thanks for making them available.

I'm trying to get all of the gallery thumbnail images to overlap each other by 15 pixels. Is there one line of script that I can add to accomplish this for all the thumbnails, or will I need to insert multiple scripts with absolute positions for each individual thumbnail?

Thanks again!

Steve
(14.08.2007, 15:46)

Sally:-
I've downloaded a few different galleries and most work, including the images.
This one didn't. When I display in IE or Mozilla, the border for the thumbnails appear but not the actual images. However, when I run the mouse over each thumbnail border, the corresponding larger picture appears where it should be.
Help!
(01.09.2007, 03:32)

Dave:-
Hi Stu,
Everything seems ok with this until i move the Style code into a separate CSS, at this point the default image does not show, I've read through all the comments and it appears it is mentioned a couple of times but no real answer. Please help I really like this sample.
(20.09.2007, 23:49)

kim:-
hey stu im a rookie with the whole web site thing.i have a photography web site.
this side scroller is a dream come true.
can i import this to my web site ?
or do you know how i can buy this software.
killersites.com is my web server. there customer
service people dont have a clue
any help would be great thanks for your time
if any one can help me please e mail photofixco@tampabay.rr.com
(10.10.2007, 20:09)

grammy:-
I would like to use your Photo Gallery MK.2 to display various products across many pages. Each page would be a different category of products, requiring a different set of photos. Would I have to change the css for each of the slides for each page (corresponding to the image sources for those pages)? Or, is there a way to use an external css to simplify these changes? I'm still rather new at css, but I'm learning more now that I've discovered this site! Excellent work!
(14.11.2007, 21:42)

Stu:-
grammy, the CSS should be held in two external files. One for IE7 and non-IE browsers, the other for IE6 (loaded using conditional comments).
You will need to have all the thumbnails styled in the CSS for all the pages and then the html would be identical on each page except for the large image files and the <a class="gallery slidea" etc would need to reference the correct thumnails.
(14.11.2007, 22:14)

Karina:-
I'm trying to use your gallery in a site I have.But when I insert the code in the page the links placed from the scrollbar to the top of the page donôt work no more (the navigation bar and an aux. submenu)
if I change the #pad height value and put it on top of the page it works fine, but I dont need the scroll gallery up there :S

Could you please, please, tell me what am I doing wrong with your code?
(21.11.2007, 12:28)

Vanessa:-
Hello Stu,
your work is a treasure! Thank you very much! I like the Scrolling Photo Gallery very much and I'm going to use it but I'd like to have the thumbs at the top.Do you have any ideas how to do that? Thank you very much for your effort!
(26.11.2007, 22:02)

Terry:-
Stu,
Looks like the last post is from 2007 so I'm not sure you're still taking questions, so here it goes:
I am not by any means a novice, on the contrary, I'm quite fluent in HTML and CSS, but, here's my problem: I downloaded the MK 2 page, and stripped the code for the scrolling gallery. The problem is that the thumbnails don't show up. Everything else works beautifully. It's just that the thumbnails don't show up. Even when I leave the downloaded
page intact (the mark up is untouched) they still won't show! Any ideas?
(I'm using FireFox 2.0 and IE6 to view)
Thank you in advance for any help you can give me!
(06.06.2008, 05:47)

Stu:-
Terry, check that you have the path to the thumbnails relative to the css file.
(06.06.2008, 08:00)

Sandy:-
Ok, after playing with this for 2 days I've got it all set up with percentage widths for viewing on any size browser, and it is centered correctly! My only problem now is the hover image is not consistent over the background image .. each picture opens further to the right...here is the page:
www.ficarradesignassociates.com/portfolio4.htm
Any help would be greatly appreciated!!!
(18.12.2008, 17:49)

Nancy:-
Hi Stu,

I like how this is looking in my site-just have a problem with the first thumb not showing up in certain browsers-IE.

flyingwong.com/photos.html
(04.05.2009, 19:47)

melissa:-
i have this scrolling gallery on our home page but i do not believe it works with IE8. any suggestions on how to change the code to get it to work? thanks so much!
(12.05.2009, 18:42)

melissa:-
i posted the previous comment but did not leave a web address. this worked fine until i upgraded to IE8. and now it only works in the compatibility mode. could someone please check out the code and see where i may have gone wrong? thanks so much!

ksoftcorp.com/checkcashingmanager/ccmscreenshots.htm
(13.05.2009, 22:24)

Stu:-
Unfortunately this is a problem with IE8 that cannot be easily fixed. I will be reviewing all my demo over the coming months to see if they can be made to work with this browser.
The joys of IE. We now have to cater for IE6, IE7 and now IE8 all with different bugs. (also IE5.5 for some websites)
(13.05.2009, 22:39)

Stu:-
melissa, I have now fixed the gallery in IE8, but your page does not display the gallery at all in Firefox etc.
(16.05.2009, 12:31)

JULDY:-
Great article - thanks! It is so important for people to do their homework when choosing Website Designing related Topics. If you're interested in purchasing Domains and etc , checkout the site with all related great information..
(07.08.2009, 02:08)

rie:-
What am I supposed to do to use somethingyou posted? I see no code or anything!Help me, this site is very frustrating.
(18.05.2010, 04:23)

Stu:-
If you took the time to check the site FAQs you would find the answer.
This is just my site to showcase my work and experiments with CSS.
(18.05.2010, 14:08)

Joey:-
When I hover over the image it shows up in the scroll box. What can i do to fix this?
(15.09.2010, 03:25)

James:-
think i'm being stupid but i would like the code for the simple photo gallery, i have made a donation and apart fom viewing the source code i can not see where to copy the code from. can you help?
(14.05.2012, 11:19)

james:-
found it in FAQ thanks
(14.05.2012, 11:31)



Post

Your comment:

Your Name:

Stu's First Name - 3 letters (required)

Thanks to Alex for this script.

Please enter your comments for this site page.
Please note that all posts are moderated.

Posting rules

HTML is turned off
Maximum word length is 80 characters.
Messages limited to 1200 characters.
Web links should not include 'http://'

Support CSSPLAY

Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.


CUSTOM SEARCH

Facebook Twitter rss feed Facebook Fan Page