Expert Needed for JS Modification

abcdefGARY · #1 01-01-2008, 09:16 AM

Hello, I'm currently producing a site that uses javascript. However, I know nothing about the language and was wondering if someone could help me out.

I found Leightbox (a modification of the Lightbox script) a few days ago to display inline content on a JS overlay. I tried iBox and Thickbox, but this best suits what I want and the appearance is easy to modify.

However, I have a problem with the script, and that if the script is called through a link at the bottom of the page, it would display the Leightbox at the top of the page, rather than at the current page. So that means that everytime I have to scroll up to see the box.

For an example, copy this into a .htm file:

Code:

<!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">
<head>
<title>Leightbox</title>
<!-- Meta Tags -->
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<!-- CSS -->
<link rel="stylesheet" href="http://eight.nl/files/leightbox/css/screen.css" media="screen,projection" type="text/css" />
<!-- JavaScript -->
<script type="text/javascript" src="http://eight.nl/files/leightbox/scripts/prototype.js"></script>
<script type="text/javascript" src="http://eight.nl/files/leightbox/scripts/lightbox.js"></script>
</head>
<body>
<p style="color: #FFF;">Scroll down. Pretend that blank space is content.</p>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<div id="container">
	<h1>Leightbox</h1>
	<p>I've changed ParticleTree's lightbox functionality to allow the use of inline div's instead of AJAX calls. Very often I find that I want the data in the lightbox to be indexable by search engines and visible to people with screenreaders etc. This adaptation makes that possible. Mind you, i've completely removed the AJAX calls.</p>
	<p>
		<ul>
			<li><a href="#lightbox3" rel="lightbox3" class="lbOn">Leightbox 3</a></li>
		</ul>
	</p>
	<p class="footer">
		<a href="leightbox.zip" title="Paging Files">Download Source</a>
		&middot;
		Simon de Haan
		&middot;
		<a href="http://www.eight.nl">Eight Media</a>
		&middot;
		The Netherlands
	</p>
</div><!--container-->

<div id="lightbox3" class="leightbox">
	<h1>Leightbox 3</h1>
	<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec aliquet. Donec sit amet elit at nisl commodo pellentesque. Proin vel odio. Proin vitae mi eu libero consequat rhoncus. Pellentesque aliquam varius purus. Etiam ac mauris sit amet purus facilisis dapibus. Nulla tellus. In aliquam sem. Duis nisi velit, scelerisque egestas, feugiat id, suscipit et, mi. Vestibulum id erat eu enim nonummy fringilla.</p>
	<p class="footer">
		<a href="#" class="lbAction" rel="deactivate">Close</a>
	</p>
</div>
</body>
</html>

You'll notice that when Leightbox pops up after you click "Leightbox 3", it shows the Leightbox at the very top of the page, rather than in the current view (like the original Lightbox). This causes you to have to scroll up to the very top to view the Leightbox.

Hopefully I have made my point very clear, I don't know how to explain it any better. My new website has this script implemented and it is very important to the functionality of the site. So, if anyone is capable of fixing this, it would certainly be appreciated. And I would certainly consider a reward since this is very important to me that it's fixed.

Thanks.

Master_script_maker · #2 01-01-2008, 05:30 PM

this is what is the code that keeps it to the top (screen.css):

Code:

top: 25%;

if you remove that you can manually set it in each one by adding this:

Code:

<div id="lightbox1" class="leightbox" style="top: px from the top">

i could do it if you give me the website.

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search