![]() | ![]() |
| ||||
| Howdo, I found a very simple lightbox script which is working fine. However on one particular page, I have a lot of images. This means the screen is pushed down and when the user clicks the thumbnail, the lightbox appears but for the lower placed images I have to scroll up. Basically, the css for the lightbox div dictates that it is placed 25% from the top of the container div and 25% from the left. I want it to be relative to the thumbnail as opposed to the top of the screen. Make sense? I could use another script, in fact I probably should as this is not suitable for more than a few images, however as I have used the script across the site already, Im just wondering is it possible to update the script and save me have rewrite. CSS Code: .black_overlay{display: none;position: absolute;top: 0%; margin-left: 0px; margin-right: 0px; width: 100%; height:100%;z-index:1001;-moz-opacity: 0.8;opacity:.80filter: alpha(opacity=20);}
.white_content {display: none;position:absolute;top: 25%;left: 25%;width: 400px;height: 320px;padding: 16px;border: 2px solid white;background-color: white;z-index:1002;overflow: auto;}
Code: <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">
<img src="images/gallery/gf1.gif" title="Made To Order" style="float:left; border: 2px solid #cccccc; margin-right: 5px; margin-bottom: 5px;" />
</a>
<div id="light" class="white_content">
<img src="images/gallery/gf11.gif" title="Made To Order" />
<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div>
<div id="fade" class="black_overlay"></div>
__________________ “When you want something, all the world conspires in helping you to achieve it.” www.waffle.ie waffle.ie/members/wheres me jumpa Waffle Arcade Waffle Casino Waffle Radio Waffle TV NSFW.ie wheresmejumpa.com |
| ||||
| Resolved, added a relatively placed div around the html above and the larger images now appear relative to the row of thumbnails.
__________________ “When you want something, all the world conspires in helping you to achieve it.” www.waffle.ie waffle.ie/members/wheres me jumpa Waffle Arcade Waffle Casino Waffle Radio Waffle TV NSFW.ie wheresmejumpa.com |
| |||||
| alternatively you should give your new div .. focus
__________________ Forbairt Media | Web Design & Development Galway / Dublin, Ireland - coming soon ... ( vague but descriptive isn't it ) Recent Work: Safari Club African Safari Holidays - South Africa Safaris Other Stuff: FluffyLinkulator Rapid Inclusion Service Tools |
| ||||
| mmmm what is this focus you speak of \\goes off to google.
__________________ “When you want something, all the world conspires in helping you to achieve it.” www.waffle.ie waffle.ie/members/wheres me jumpa Waffle Arcade Waffle Casino Waffle Radio Waffle TV NSFW.ie wheresmejumpa.com |
| Tags |
| css, html, lightbox |
| Thread Tools | |
| Display Modes | |
|
|
| | ||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Pricing Script? | blacknight | CMS and Content Management | 12 | 28-01-2008 05:03 PM |
| Java Script Help | daryllsheridan | Coding Help | 1 | 16-03-2007 11:31 PM |
| GeoTraceRoute Script | Cormac | Coding Help | 6 | 28-02-2007 11:12 PM |
| script help.... concatenation? | 7aken | Coding Help | 1 | 06-02-2007 12:06 PM |
| What's this script? | blacknight | Webmaster Discussion | 0 | 23-08-2006 10:49 PM |