I’ve just finished creating my first site, using Dreamweaver CS3. Should mention that I’m an illustrator, so the site heavily relies on images. At present the two gallery pages operate on a thumbnail opening in a new window, which I don’t mind but having read a few comments on the web, people seem to loathe this method, so I’m gonna try & switch to ‘slimbox’. I’m no programmer & frankly am amazed that I’ve got this far without breaking the internet; I’m after a very basic step by step guide to setup slimbox…have downloaded mootools.js but have no idea where it goes in dreamweaver! Any help would be appreciated. Cheers for now,
Connah. http://www.connahbrecon.com/
Switch to code view in dreamweaver
in the head place these three lines just before the closing </head> tag
<link rel=“stylesheet” href=“slimbox.css” type=“text/css” media=“screen” />
<script type=“text/javascript” src=“scripts/mootools.js”></script>
<script type=“text/javascript” src=“scripts/slimbox.js”></script>
(assuming you have placed the scripts in a folder called scripts in your web site that is)
Next, make each thumbnail a link to the larger image in the usual way
then add this tiny little bit to each link in source view
rel=“lightbox-connah1” like this
<a href=“images/swimming-pool-3-m.jpeg” rel=“lightbox-connah1” title=“What ever it is”><img etc…</a>
You can have several sets displayed as separate shows by using rel=“lightbox-connah2” or rel=“lightbox-connah3” to each image in the appropriate set.
easy eh? And no programming skills used at any point. The text as title is displayed as a caption.
PS just for fun I like changing the size of the large image every two or three images, just so it animates a bit more. Silly, yes, but the clients think it is clever stuff.