Hey gang!

 

I'm working on an idea, and I was hoping I could get some technical help.

 

I'd like to add a Lightbox that loads automatically when someone visits a page at the Broomcloset. The idea is the include links to the Two Guys' website, the Kickstarter, and this forum -- that way people reaching one of the site's subpages via Google will be up-to-date on all the latest happenings (and, hopefully, will then rush off and pledge $10,000 to the SpaceVenture).

 

I know almost nothing about Java, so if anyone has any ideas on how I could make this happen, I'd appreciate the input.

 

Thanks!

 

Jess

That's JavaScript, not Java.

 

All you need is some server-side wrapper to include the relevant JavaScript code in every page. If you were already using server-side includes to present your layout, that should be pretty easy. Otherwise, you'd have to copy and paste that into every page (or move all your pages to an archives directory and work some .htaccess magic to redirect them to one page that included the originally-requested page but also the Lightbox code)

It uses JavaScript, not Java. It is fairly self explanatory on the page you listed. The download is just the css, js and images that you need to upload to your site.

 

Put the

<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/lightbox.js"></script>
<link href="css/lightbox.css" rel="stylesheet" />

in the header of your pages and link to the images like the following

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>

By the way, Lightbox is primarily for images and not text. You'd probably want something like iBox.

I'm tinkering around with iBox and not having a lot of luck yet. I'll stick with it and see if I can make it work.

 

Thanks!

 

Jess

I've uploaded an example copy of what would need to be done to http://pcj.bz/vbc/

 

Note especially the

in the header, as well as the

onload="iBox.showURL('example.html');"

in the tag.

 

Let me know if I can help further.

Thanks, pcj! I'm still trying to figure it all out, but your example definitely helps. Ideally, I'd like to tinker with the "look and feel" of the Lightbox a bit, but I'm guessing that's the easy part.

 

I haven't done any real web design in almost a decade, and I never really tinkered with JavaScript at all, so I appreciate all the help. For now, my goal is to direct people to the Kickstarter, but once the website merger is complete, it seems like a reasonable way to both send people to the new site and keep the old one around as a "virtual museum" (as some have requested).

 

Jess

pcj -- Do you happen to know where I would make changes to the width and height of the Lightbox? Am I correct in assuming that other styling features (colors, fonts) can be made by editing the target HTML document?

 

Thanks again! You're a huge help...

 

Jess

You can change the height and width of the Lightbox by altering the iBox.showURL call:

 

iBox.showURL('example.html','Title of window',iBox.parseQuery('height=350&width=500'));

As far as other styling, you can edit the target document and/or use CSS to style the lightbox itself: http://www.enthropia...me.php#skinning