one page responsive template - lightbox not working

[wdesign]

Hi,
I was hoping someone could help me with applying a lightbox to portfolio images. It seems the images are placed through CSS and not embedded on the page. There is an image rollover CSS rule but the template wasn't finished with the lightbox.

This is what it should look like:
http://www.templatemo.com/templates/templatemo_406_flex/

This is the site I'm working on:
http://wswdesign.com

The images under "latest work" are placed in the page the ones under "portfolio" are added through CSS and don't show on the page until going live.

Thank you graciously for any help

Here is an example of my code for one image:
<ul class="portfolio">
<li class="item design">
<div class="portfolioitem">
<img src="img/print1.jpg">
<div class="portfoliohover">
<div class="info">
<h1>+</h1>
<h5>trade show graphics</h5>
<h6><b class="light-gray">Celguard / Membrana</b></h6>
</div>
</div>
</div>
</li>

 

[chrishirst]

If you have a "#" in the href ... ... a click is ALWAYS going to refresh the page unless you return 'null' and prevent the event from 'bubbling' the onclick event up from your handler.

 

[wdesign]

HI there thanks for responding. I don't see where the empty "#" link is. I was thinking I need a CSS rule for the lightbox?

 

[chrishirst]

<!-- Start Single Block -->
<li>
	<div class="section block">	
		<img src="img/placeholder_large2.jpg">
		<div class="content">
			<h5>NASCAR Race Car Graphics</h5>
			<h6>Vehicle Sponsorship</h6>
		</div>
		<div class="hover">
			<a href="#" class="hover content">
				<h2>+</h2>
				<h5>Type Work</h5>
				<h6>Print Design</h6>
			</a>
		</div>	
	</div>
</li>
<!-- End Single Block -->

But if you want a lightbox style 'popup' you need the lightbox style javascript or whatever it is you want to "popup" using CSS has to exist in the source as child element of the hover target.