Printable View
This small MouseOver photo gallery may be useful to others who are wanting more photos per page.
You can replace the photo's and thumbnails simply by selecting each layer one at a time and drag and drop your photo from Windows Explorer to the large image. This will replace the supplied image with your own and update the thumbnail automatically.
(See Egg's video on how to do this)
ORIGINAL PHOTOS SUPPLIED WITH XARA XTREME 4
Thank you Steve :)
Pleasure John.
Here's the same page but with a dark theme and rounded corner thumbnails.
Sweet! This just might be a cool option for my site!
Could this be added to the Popup thread at:
http://www.talkgraphics.com/showthread.php?t=38625
I am amazed at the possibilities for Gallery Design in Xara!
Perhaps this isn't the place, but here it goes. I am noticing that the "special" MouseOver and MouseDown designations are really not that special. Most work involves naming and linking to layers which do not have these words in them. I think the Xara Help intends to help authors organize their layers and does not affect whether the site works or not.
Just an observation.
Nice work on the 21 gallery!
Thanks a bunch, Steve, this is very useful! I found that you don't have to change the pictures layer by layer. Just drag & drop your pictures from Explorer to each of the thumbnails, but make sure that the mouse pointer is roughly in the middle of the thumbnail when you 'drop' (otherwise the picture is placed in the background). This makes customizing your picture template really easy.Quote:
Originally Posted by sledger
Yep either, or. Both methods work :)
Your observation is wrong. There are generally 2 kinds of "effect layers". We call them "Rollover layers" and "Popup layers". The popup layers can have any name and are recognized by the links to them in the popup fields of the web properties dialog (there are 2 of them: Link tab "Popup layer", and Mouse-over tab "Show popup layer").Quote:
Originally Posted by robobugs
The rollover layers are recognized automatically by their name, you don't need (and you can not) link to them, they work automatically, you just have to create such a layer, place it on the right position among other layers, and give it the name that starts with "MouseOver" (or MouseDown).
For more details please read the help.
What size image files are you using?
Thanks, Ted D.
Hi Ted,
The placeholder size determines the size of the thumbnail and larger image on export. WD does this automatically.
So it doesn't really matter what size image you start with, though it's best if they are at least the same size as the large placeholder (680x430 in my examples)
You can change the large placeholder dimensions to whatever you require.
Steve,
Very nice layout. Thanks!
Personally, I prefer the mouse-click better than mouse-over so I did a quick modification to your .web file. With the mouse-click option, I like how you can move to different pictures in different rows without other pictures in between displaying.
Good work BQ http://www.talkgraphics.com/images/icons/icon14.gif - sometimes clicking is a better option than hovering :D
Web Designer gives you freedom and options ;)
And don't forget soft-groups. SG's make short work of redesigning or resizing all placeholders at once.
Thanks Sledger, I had built a siminlar rollover but I was disastified by the flicker going from one photo to the next (http://gracehjs.com/grace/Web%20Desi...2007_hemel.htm). I looked at yours and the only difference was that on the link you had "when selected object is click - do nothing". That definitely helps with the flicker.
Thanks Grace. Not sure about the flicker, I can't repeat it.
My personal favorite in this little series of gallery pages.
This is a two page version with next/previous arrows ◄|►
I guess this makes it a 42 photo gallery :)
Great templates Steve. They will come in handy.
Very professionally looking must admit. :cool:
Very nice gallery templates Steve
Thanks for sharing:D
Great Work Steve...
I'll be using these for sure, very professional..
Kind Regards... Steve
Thanks for all the comments :)
Here's the last in this series.
This one has 'growing thumbnail' mouse-over thumbnail effects.
It's great to see a number of professional, creative layout options that address a common situation. Your fine work is greatly appreciated, Steve. :)
Thanks Curtis, I'm happy that they are useful to people :)
Now that is very cool. Thanks Steve!
Lateral thinking in action - nice one Steve :)
Hi,Quote:
Originally Posted by sledger
I would like to use the MouseOver photo gallery on a page created with dream weaver but don't now how to import it.:(
I have downloaded the photo templates which are really nice .....and i would like to put them in the photo galleries .....is this possible and how do I do it
Thanks
Mike
Rename the files you downloaded by changing the .web extension into .xar; using Windows Explorer, place them in the "Photo Galleries" folder; in XWD, select the "Photo Galleries" folder in the "Designs Gallery" and click the "Disc designs" button on top; browse to the "Photo Galleries" folder and click "Update". That should do it.
Thanks alot ....that works great
Mike
Hi Guys,
Im trying to use one of the design galleries you guys have uploaded, but when I copy and paste it into my own page, it loses all functionality.
The normal photo galleries which come with the software in the design gallery copy and paste into my site and work well, but the ones you guys have put up in here dont work.
Any help would be greatly appreciated
Scott
Make sure all layers are visible, select all, copy to clipboard and paste-in-place into your new document page.
Demo:
DOWNLOAD or FULL SCREEN 3.65mb
Quick question for "sledger". First off, I love the 21 gallery and it looks great on my site here. I've loaded 3 full pages of images and the site is already bloated out to 26 mb. I batch resized all the original images to 640x480 and "dropped" them into the template as directed here. These images were all between 40-70 kb. When I went back and looked at the index.htm files, all these images were converted to png's and are now around 300-500 kb. I did a search and found your post back in May that referenced the intro material explaining the reason for conversion. My question, when you created the template, are there shadows applied to the pics as I import them. The material referenced shadows or rotations, etc. What should I be looking for? Thanks in advance...
Disregard my previous post...I've got it fixed. I followed the directions in the help file for exporting images as jpeg's. Unfortunately I had to edit each of the 63 photos web properties individually. Also, unless you delete the existing index.html files folder, and replace with the revised files, the pngs will remain along with the jpg files. But the process did work as instructed.