Results 1 to 4 of 4

Thread: Lightbox 2.03a

  1. #1
    Join Date
    Feb 2008

    Default Lightbox 2.03a


    I want to build in Lightbox 2.03 in my future website, so when people click on a picture they see the picture in bigger size. I downloaded the software. But after that I really don't know what to do. They have an installation instruction, but I really don't understand any of that. I will post the instruction below, maybe someone can explain it to me in normal words what to do.

    Many many thanks,

    This is the instruction:

    Step 1: Insert the below code in the HEAD section of your page:

    <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><link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /(now where is the head section of the page?)
    Lightbox v2.0 uses the Prototype Framework and Scriptaculous Effects Library.
    Step 2: Create your "thumbnail" image links, for example:
    <a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

    The rel attribute is mandatory in order to activate the effect for this particular image. The "title" attribute is optional, and when defined, adds a caption beneath the enlarged image.
    The "href" attribute obviously should contain the path to the enlarged image.
    If you wish a particular caption ("title") to be hyperlinked to a specific URL, throw in a "rev" attribute pointing to the desired URL. For example:

    <a href="images/image-1.jpg" rel="lightbox" title="my caption" rev="">image #1</a>
    LightBox version 2 also adds the ability to group multiple image links together, so an image gallery is created out of the enlarged images:

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

    As you can see, to group image links together, simply modify the "rel" attribute to be "lightbox[roadtrip]" instead, where "roadtrip" is an
    arbitrary but unique name for that group. You can have multiple groups of images on the same page- just use a unique group name in each case.
    Grouped images can be cycled through by clicking on the right/left edges of each enlarged image.

    (well I didn't even get through step 1, so this is even more bla bla to me:P)

    many many thanks

    Moad Chekh

  2. #2
    Join Date
    Feb 2006
    Kings Lynn Norfolk UK

    Default Re: Lightbox 2.03a

    Hi, if your new to website scripts? you would be better using Jalbum its very flexible & will do the same with the right skin. Only an idea.

  3. #3
    Join Date
    Dec 2005
    Pittsburgh, Pa

    Question Re: Lightbox 2.03a

    Are there any tutorials on using Lightbox?

    I would simply like to learn how to use it.

    I may implement it on some of the websites I am working with.
    But need to at least see some tutorial on its use.

    Thank you

    Robert Montgomery
    Robert A. Montgomery

  4. #4
    Join Date
    Feb 2007

    Default Re: Lightbox 2.03a

    are you referring to the light house tool Blue Voda offers? if so:
    1. click on the tool on the left side and position in the middle of your viewing area.
    2. double click the tool and a configuration box comes up.
    3. choose the size of picture you want with a drop down menu. if your site is 800 pixels wide you cannot choose 240 x 240 with 4 across, but you could do 3 across.
    4. it is important that all your pictures are the same size to start. a good size is 600 x 450 or something like that. when someone clicks on the picture, this is the picture that will come up. if you do not have the pictures the same size to start with, you must use variable as the option. 5. you add a picture by clicking the add button and it will browse to the place you have your pictures on your harddrive.
    a good example of using light house is:
    this whole site uses lighthouse throughout.
    hope this helps

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts