Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 3 1 2 3 LastLast
Results 1 to 10 of 23
  1. #1
    Junior Member
    Join Date
    Dec 2012
    Posts
    29
    Member #
    34228
    I'm looking for a lightbox and/or script to do the following:

    - specify an image directory and images are fetched automatically.
    - lightbox can be launched from a single image or text link.
    - does NOT display any of the image gallery within div content. It only shows the images when launched.

    I have found something like this here, but it forces images on the page (within the div content). I need that script to not show any images whatsoever except for one, which launches the lightbox.

    Any ideas?

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    So you're looking for a website that displays a photo on a page ... that's all, just one photo. There is no other content, text, or anything except the photo and "navigation" buttons. Then, when someone clicks a "next" or "previous" button, it slides that photo aside to the next one, etc.

    Is that what you mean?


  4. #3
    Junior Member
    Join Date
    Dec 2012
    Posts
    29
    Member #
    34228
    No, I'm looking for a way to display lots of photos in a lightbox without having to reference all of them by hand. I want a php script to work appropriately with a lightbox, or some solution of that sort, to search an image directory and display all photos in that directory after the user clicks on one photo, or any photo I chose to have the lightbox open with. But I don't want all of the photos in the image directory to be displayed on the actual page like a photo gallery... I want the user to slide through each photo. But I can't find a slider that allows me to just set an image directory. They all require some kind of manual image referencing. Also, I want the slider or lightbox to adjust to the size of each photo. Finding both the sizing thing and the image directory is something I can not find.

    I found this solution (the second script), but not sure how to make it work with a lightbox:
    http://ellislab.com/forums/viewthread/65899/

    Also, something like this but without displaying all the photos.
    http://www.fatbellyman.com/webstuff/...lery/index.php

  5. #4
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    Here is an example I made ...

    This is the original page with the thumbs and lightbox:
    http://www.sarahhewitt.com/gallery.php

    This is my test page that displays the first photo and when you click it opens them all in lightbox:
    http://www.sarahhewitt.com/test.php
    I'm using a different set of photos because the sizes are nicer.

    Is that what you mean by one photo and the rest are in lightbox?
    If you view the HTML source, you'll see all of them there, but only the first one is visible, the rest of them are "display:none;"

    If that is what you're looking for, let me know.
    The part about getting them from the directory is easy ... BUT ... notice I have titles and captions. You won't be able to do that if you are simply pulling photos from a directory. Do you know that?


  6. #5
    Junior Member
    Join Date
    Dec 2012
    Posts
    29
    Member #
    34228
    Yes, the second example is exactly what I'm looking for. And I need them to have a directory. I'm not sure if this requires php scripting. However, I could easily change the index to my website to .php

    In regards to your question about the captions; yes, I aware. I found that out last week after spending 10 hours fiddling with numerous lightboxes.

    All of the image files are appropriately named, so therefore, if the lightbox displayed the filename as the title, it would suffice.

  7. #6
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    I have another idea for you ...

    If you name your files like this: The_Mountains_in_Colorado_-_2012.jpg
    (make the filename the title with underscores as spaces)
    No other special characters allowed ... only underscores and dashes.
    PHP can parse that filename and make it an actual title or caption.

    Step 1:
    Create your directory of photos. Use descriptive filenames like I mentioned if you wish.

    Step 2:
    Create your webpage (perhaps you are calling it "index.php").
    For now, enter about 6 of them manually in your HTML.
    Get it to work without using any PHP at this point.

    The first one is normal ... this is the one that appears on your page ...

    <a href='./photos/LampLight1.jpg' rel='lightbox[photos]' title='LampLight'><img src='./photos/LampLight1.jpg' border='0' alt='LampLight' title='LampLight' style='padding:12px; float:left; overflow:hidden;' /></a>

    The rest of them have the <div> around them (to hide them).
    You only need to enter about 4 of them, just to test out your lightbox ...

    <div style='display:none;'>
    <a href='./photos/LampLight1.jpg' rel='lightbox[photos]' title='LampLight'><img src='./photos/LampLight1.jpg' border='0' alt='' style='padding:12px; float:left; overflow:hidden;' /></a>
    </div>
    <div style='display:none;'>
    <a href='./photos/Ocean2.jpg' rel='lightbox[photos]' title='Ocean'><img src='./photos/Ocean2.jpg' border='0' alt='' style='padding:12px; float:left; overflow:hidden;' /></a>
    </div>

    Step 3:
    Get your page to work properly with lightbox. Don't worry about any PHP at this point. If you can get it to work by coding the HTML by hand, the PHP script will replace the part where you have entered your photos. We can do that later.

    Step 4:
    Give me a link so I can see your working page with lightbox working properly.


  8. #7
    Junior Member
    Join Date
    Dec 2012
    Posts
    29
    Member #
    34228
    Ok, done. Lightbox launches when you click the image in the middle of the page. I actually wanted this to be an image slider, but finding a slider that has automatic height and width and setting an image directory was absolutely impossible, so lightbox will have to do instead.
    http://www.danperceval.com

  9. #8
    Junior Member
    Join Date
    Dec 2012
    Posts
    29
    Member #
    34228
    Using php, I want to get the lightbox to load images from an image directory all while leaving the same functionality of the page displaying only one photo before the lightbox is opened up. How do I do this?

    Page:
    www.danperceval.com

  10. #9
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    I'll get back with some code later this evening.


  11. #10
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,717
    Member #
    5580
    Liked
    718 times
    Below is what I think the scripting should be for your "Start Template Pages" section.

    Make a safe copy of your current page before you replace your section with mine.
    I didn't test this, so if you get any failures, let me know ... or maybe you can figure it out.

    PHP Code:

    <!--Start Template Pages -->
    <b>What is Xtreme Ice Skating?</b>
    "Xtreme Ice Skating is an extreme sports culture on the ice. It helps one to overcome their fears as well as learning to become an individual, leader, entertainer and inspiration to others. Xtreme is such a raw combination of creativity, power and showmanship, that one's possibilities are endless. It is this new combination of thrill-seeking and adrenaline-inducing energy that defines Xtreme Ice Skating."

    <?php
    // folder name where they are stored.
    $folder_name="tricks_images";

    // put these types of images into an array.
    $images array_merge(
    glob("$folder_name/*.jpg"),
    //glob("$folder_name/*.png"),
    //glob("$folder_name/*.gif")
    );

    // loop through and create the show
    $pos=1;
    foreach(
    $images as $image){
    // create the title from the filename
    $title=str_replace("_"," ",$image);
    $title=str_replace(".jpg","",$title);

    // the first photo displays different than the rest of them.
    if($pos==1){
    echo
    "<a class=\"group2\" href=\"".$image."\" title=\"".$title."\"><img class=\"image-border RainbowStop\" src=\"".$image."\" /></a>";
    }
    else{
    echo
    "<a class=\"group2\" href=\"".$image."\" title=\"".$title."\"></a>";
    }
    $pos++;
    ?>
    <!--END Template Pages -->



Page 1 of 3 1 2 3 LastLast

Remove Ads

Posting Permissions

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

Search tags for this page

wordpress blogs

Click on a term to search for related topics.
All times are GMT -6. The time now is 04:44 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com