logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 09-16-2011, 02:20 PM   #1
newbie23
 
Join Date: Sep 2011
Posts: 1
Default LIGHTBOX help

Hi Guys

I am desperately trying to figure out how to incorporate Lightbox into my website. At the moment I have images showing by thumbnails into a larger viewing box with a mouseover system. I would like to change this to lightbox.
I just can't quite figure out the code to use.
This is what I have at the moment....what do I need to do?

Code:
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<script src="AC_RunActiveContent.js" type="text/javascript"></script>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style2 {font-size: 18px}
.style3 {font-size: 14px}
-->
</style>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style4 {color: #C7DF13; font-family: Georgia, "Times New Roman", Times, serif;}
-->
</style>
</head>

  <div id="Accordion1" class="Accordion" tabindex="0">
              	  
                <div class="AccordionPanel">
                    <div class="AccordionPanelTab">CELEBRATIONS</div>
           	      <div class="AccordionPanelContent">
                    <div class="thumb">
							<p><img src="images/Gallery images/70 x 70 for web/Celebration/Celebration19_sml.jpg" onmouseover="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Celebration/Celebration19_web.jpg';" onmouseout="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Logo_gallery.jpg';" >
							  <img src="images/Gallery images/70 x 70 for web/Celebration/Celebration18_sml.jpg" onmouseover="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Celebration/Celebration18_web.jpg';" onmouseout="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Logo_gallery.jpg';" >
							  <img src="images/Gallery images/70 x 70 for web/Celebration/Celebration2_sml.jpg" onmouseover="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Celebration/Celebration2_web.jpg';" onmouseout="document.getElementById('bigimg_occ').src = 'images/Gallery images/350 x 350 for web/Logo_gallery.jpg';" >
							  <br />

Last edited by Corrosive; 09-16-2011 at 03:49 PM.. Reason: wrapped in code tags
newbie23 is offline   Reply With Quote
Old 09-16-2011, 03:49 PM   #2
Corrosive
Corrosive's Avatar
 
Join Date: Feb 2008
Location: Bristol, England
Posts: 7,103
Default

Follow the instructions here; http://www.lokeshdhakar.com/projects/lightbox2/
Corrosive is offline   Reply With Quote
Old 09-16-2011, 04:16 PM   #3
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

And make sure you delete the current code before you start following the Lightbox instructions.
domedia is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 12:14 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com