Jump to content


  • Content count

  • Joined

  • Last visited

1 Follower

Profile Information

  • Real Name
    Kyle Finch

Recent Profile Visitors

2,573 profile views
  1. SpecOpShop

    Gallery Page

  2. SpecOpShop

    Gallery Page

    I have added my page (http://www.specopshop.com/outside_the_wire.php) and link button to the nav bar in the header. Now I would like to add the overlay image gallery. Where would I add this? I need it to have the thumbnails in the area that now holds the included outside_the_wire.php file from the languages/english directory. This is the overlay code: <?xml version="1.0" encoding="us-ascii"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"> <head> <title>Outside The Wire</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" src="http://cdn.jquerytools.org/1.2.6/all/jquery.tools.min.js"></script> <style type="text/css"> /* the overlayed element */ .simple_overlay { /* must be initially hidden */ display:none; /* place overlay on top of other elements */ z-index:10000; /* styling */ color:#fff; background-color:#333; width:750px; min-height:200px; border:1px solid #666; /* CSS3 styling for latest browsers */ box-shadow:0 0 90px 5px #000; -moz-box-shadow:0 0 90px 5px #000; -webkit-box-shadow: 0 0 90px #000; } /* styling for elements inside overlay */ .details { position:relative; top:15px; right:15px; font-size:11px; width:150px; } .details h3 { color:#aba; font-size:15px; margin:0 0 -10px 0; } /* close button positioned on upper right corner */ .simple_overlay .close { background-image:url(http://specopshop.com/images/close.png); position:absolute; right:-15px; top:-15px; cursor:pointer; height:35px; width:35px; } /* some styling for triggers */ #photos img { cursor:pointer; } </style> </head> <body> <!-- trigger elements --> <div id="photos"> <p><img src="http://www.specopshop.com/images/Site-MC-SOU-Pants.gif" width="166" height="115" rel="#photo1" /></p> <p><img src="http://www.specopshop.com/images/Brick.jpg" width="166" height="115" rel="#photo2" /></p> </div> <!-- overlays --> <div class="simple_overlay" id="photo1"> <img src="http://www.specopshop.com/images/Site-MC-SOU-Pants.gif" /> <div class="details"> <h3>SOU (Special OPS Uniform) Pants</h3> <h4>$114.99</h4> <p>Choose color and size</p> </div> </div> <div class="simple_overlay" id="photo2"> <img src="http://www.specopshop.com/images/Brick.jpg" /> <div class="details"> <h3>Black Ops Brick Ballistic Glasses</h3> <h4>$68.00</h4> <p>Comes with: smoke lenses t-peg elastic strap, regular strap hard case</p> </div> </div> <script type="text/javascript"> $(document).ready(function() { $("img[rel]").overlay(); }); </script> </body> </html>
  3. SpecOpShop

    Gallery Page

    I have 2 sites divebombinc.com and specopshop.com and I would like a gallery page where I can show products without a buy it button. I would like to have it look just like the rest of the site. Is there a way to do this or would someone be willing to copy the code from one of the more basic pages and modify it to a gallery that you could pop up an image with a short description. Basically the same way it is on the buy pages but without the buy button or price.