Reply
Problem with lightbox js
Old 02-08-2008, 03:05 PM Problem with lightbox js
Junior Talker

Posts: 4
Hey guys Im trying to get lightbox JS going on a site before I get it hosted. The problem is that when I click on the images it pushes them down the page making it longer instead of blacking out the page and opening them above it. I'm sure I have a coding issue that is very simple to correct. I'm just not seeing it. I have pasted the source below. I hope someone can help me. I also have the JS in the directory with my index.html allong with the images and lightbox directories.

<html>
<head>
<link rel="stylesheet" href="cs/lightbox.css" type="text/css" media="screen">
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<p align=center><img src="images\banner.jpg"></p>
<h1 align=center><font color=#ffffff>Erin Riley McCarthy</font></h1>
<body bgcolor=#ff66ff >
<img style="position:absolute; top:0; left:643; width:360;" src="images\triangle.gif">
<img style="position:absolute; top:15; left:50; width:900;" src="images\banner.jpg">
<img style="position:absolute; top:150; left:-100; width:360;" src="images\dot.gif">
<img style="position:absolute; top:1200; left:600; width:360;" src="images\dot.gif">
<img style="position:absolute; top:600; left:400; width:360;" src="images\dot.gif">
<div id=layer1 style="position:absolute; top:250; left:55; width:900; height:450; z-index:1; padding:5px; border: #000000 0px solid; background-color:#000000; background-image:url(images\bg.jpg); layer-background-image:url(images\bg.jpg);">
<div id=layer2 style="position:absolute; top:20; left:50; width:480; height:360; z-index:2; padding:5px; border: #000000 2px solid; background-color:#000000; background-image:url(http://i90.photobucket.com/albums/k2...2/IMG_0320.jpg); layer-background-image:url(http://i90.photobucket.com/albums/k2...2/IMG_0320.jpg);">
<div id=layer3 style="position:absolute; top:53; left:320; width:480; height:360; z-index:3; padding:5px; border: #000000 2px solid; background-color:#000000; background-image:url(http://i90.photobucket.com/albums/k2...2/IMG_0318.jpg); layer-background-image:url(http://i90.photobucket.com/albums/k2...2/IMG_0318.jpg);">
<div id=layer4 style="position:absolute; top:-95; left:400; width:149; height:216; z-index:4; padding:5px; border: #000000 0px solid; background-color:#000000; background-image:url(http://i90.photobucket.com/albums/k2...pinkbanner.jpg); layer-background-image:url(http://i90.photobucket.com/albums/k2...pinkbanner.jpg);">
</div>
<img style="position:absolute; top:500; left:-320; width:800;" border=2 src="images\IMG_0238.jpg" alt="riley"><a href="images\IMG_0238.jpg" rel="lightbox">
<a href="images\IMG_0315a.jpg" "rel=lightbox"><img style="position:absolute; top:400; left:-400; width:200;" border=2 src="images\IMG_0315.jpg" alt="dad and riley">
<div class="thumbnail">
<a href="images\IMG_0313a.jpg" rel="lightbox"><img style="position:absolute; top:400; left:-150; width:200;" border=2 src="images\IMG_0313.jpg" alt="mom and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0317a.jpg" rel="lightbox"><img style="position:absolute; top:400; left:100; width:200;" border=2 src="images\IMG_0317.jpg" alt="riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0325a.jpg" rel="lightbox"><img style="position:absolute; top:400; left:350; width:200;" border=2 src="images\IMG_0325.jpg" alt="Bobby and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0239a.jpg" rel="lightbox"><img style="position:absolute; top:600; left:-400; width:200;" border=2 src="images\IMG_0239.jpg" alt="mom and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0240a.jpg" rel="lightbox"><img style="position:absolute; top:800; left:-400; width:200;" border=2 src="images\IMG_0240.jpg" alt="mom and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0242a.jpg" rel="lightbox"><img style="position:absolute; top:1000; left:-400; width:200;" border=2 src="images\IMG_0242.jpg" alt="dad and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0321a.jpg" rel="lightbox"><img style="position:absolute; top:1000; left:-150; width:200;" border=2 src="images\IMG_0321.jpg" alt="great grandpa and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0310a.jpg" rel="lightbox"><img style="position:absolute; top:1000; left:100; width:200;" border=2 src="images\IMG_0310.jpg" alt="grandma and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0294a.jpg" rel="lightbox"><img style="position:absolute; top:1000; left:350; width:200;" border=2 src="images\IMG_0294.jpg" alt="nurse and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0302a.jpg" rel="lightbox"><img style="position:absolute; top:600; left:350; width:200;" border=2 src="images\IMG_0302.jpg" alt="nurse and riley">
</div>
<div class="thumbnail">
<a href="images\IMG_0308a.jpg" rel="lightbox"><img style="position:absolute; top:800; left:350; width:200;" border=2 src="images\IMG_0308.jpg" alt="mom and riley">
</div>
</body>
</html>
Belanos is offline
Reply With Quote
View Public Profile
 
When You Register, These Ads Go Away!
Old 02-08-2008, 03:32 PM Re: Problem with lightbox js
LadynRed's Avatar
Super Moderator

Posts: 6,746
Location: Tennessee
Get rid of all that position:absolute stuff
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
"Using or working with IE is like having to wear a 1970's polyester suit with pantyhose and a girdle, to work everyday"
Carolina Corvette Club
LadynRed is online now
Reply With Quote
View Public Profile
 
Old 02-08-2008, 03:36 PM Re: Problem with lightbox js
Junior Talker

Posts: 4
That didn't help
Belanos is offline
Reply With Quote
View Public Profile
 
Old 02-08-2008, 03:45 PM Re: Problem with lightbox js
LadynRed's Avatar
Super Moderator

Posts: 6,746
Location: Tennessee
Do you have the page on the web somewhere so we can see what's going on ?
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
"Using or working with IE is like having to wear a 1970's polyester suit with pantyhose and a girdle, to work everyday"
Carolina Corvette Club
LadynRed is online now
Reply With Quote
View Public Profile
 
Old 02-08-2008, 04:01 PM Re: Problem with lightbox js
Junior Talker

Posts: 4
Not yet but when I do I'll reply to this post and try to get some help then
Belanos is offline
Reply With Quote
View Public Profile
 
Old 02-09-2008, 12:35 PM Re: Problem with lightbox js
LadynRed's Avatar
Super Moderator

Posts: 6,746
Location: Tennessee
Do that, it'll be easier to see what's going on
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
"Using or working with IE is like having to wear a 1970's polyester suit with pantyhose and a girdle, to work everyday"
Carolina Corvette Club
LadynRed is online now
Reply With Quote
View Public Profile
 
Old 02-10-2008, 05:06 PM Re: Problem with lightbox js
AliKat's Avatar
Extreme Talker

Latest Blog Post:
Beginning Ajax with PHP
Posts: 168
Location: MS
Just a quick question should it be:

Quote:
<link rel="stylesheet" href="cs/lightbox.css" type="text/css" media="screen">
or should it be
Code:
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen">
But it sounds like the css isn't working but the javascript is.
AliKat is offline
Reply With Quote
View Public Profile Visit AliKat's homepage!
 
Old 02-12-2008, 04:43 PM Re: Problem with lightbox js
Junior Talker

Posts: 4
That had allot to do with it AliKat. I had to change some other things as well and do some fine tuning but I got it working just fine now. Thanks to both of you for your time.
Belanos is offline
Reply With Quote
View Public Profile
 
Reply     « Reply to Problem with lightbox js
 

Thread Tools

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

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off


Webmaster Resources Marketplace:
Software Development Company | Webhosting.UK.com | Text Link Brokers 


   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 


Page generated in 0.15299 seconds with 12 queries