Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 22

Thread: photo album

  1. #1
    Regular Coder Mihai's Avatar
    Join Date
    Jan 2008
    Posts
    122
    Thanks
    14
    Thanked 0 Times in 0 Posts

    photo album

    i've been looking for a simple photo album script online that can generate the album from 1.jpg , 2.jpg, 3.jpg ... 600.jpg , without me adding all the files manualy or creating a xml.
    Can someone tell me how i can generate a photo album like this ?

    Thank you

  • #2
    New to the CF scene
    Join Date
    Dec 2008
    Location
    Philippines
    Posts
    1
    Thanks
    0
    Thanked 3 Times in 1 Post
    just use the php filehandling....

    scan the directory of your images..

    for example..

    <?php
    $dir = 'images/'; // directory of your images
    $dh = opendir($dir);
    if($dh){
    while($filename = readdir($dh)){
    if(strpos($filename,'.jpg') >0 || strpos($filename,'.jpeg') >0 || strpos($filename,'.gif') >0 || strpos($filename,'.png') >0){
    echo '<img src="'.$filename.'" /><br>';
    }
    }

    }
    ?>

    just debug that if there's error... I think that's near to the solution you want with your problem..

  • The Following 3 Users Say Thank You to lxculango For This Useful Post:

    Jedi Knight (12-11-2008), LJackson (12-11-2008), Mihai (12-11-2008)

  • #3
    Regular Coder Mihai's Avatar
    Join Date
    Jan 2008
    Posts
    122
    Thanks
    14
    Thanked 0 Times in 0 Posts
    thank you

  • #4
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    This really works great. And so simple, too.

    Could you explain how to use foreach to display the images in vertical columns in rows of 3?
    Or would it be simpler to remove the < br > and use css to keep them from making one long horizontal row?


    I've added a Automatic Image Resizer to this that displays the image in fullsize when you click on it.
    Here's what it looks like:


    I'll write up some instructions and upload the necessary files if anyone wants it.

    I also use it as an mp3 gallery and again as a flash gallery.

    For mp3 gallery:
    Place this in the head of your page.
    Code:
    <script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>
    Then find and replace:
    Code:
    echo '<img src="'.$filename.'" /><br>';
    With:
    Code:
    echo '<a href="'.$url.$filename.'">'.$filename.'</a><br><br>';
    For flash gallery:
    Find and replace:
    Code:
    echo '<img src="'.$filename.'" /><br>';
    With:
    Code:
    echo '<object><param name=movie value="'.$url.$filename.'"><embed src="'.$url.$filename.'"></embed></object><br><br><a href="'.$url.$filename.'">'.$filename.'</a><br><br>';
    Last edited by Jedi Knight; 12-11-2008 at 03:20 PM.

  • #5
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts

    AIR install

    I decided to go ahead and post the instructions in case anyone wants it.

    Find:
    Code:
    </head>
    Add this BEFORE the code above:
    Code:
    	<!-- AIR-Box mod addition - starts here -->
    	<script type="text/javascript" src="mootools.js"></script>
    	<script type="text/javascript" src="{airbox.js"></script>
    	<link rel="stylesheet" href="slimbox_css/slimbox.css" type="text/css" media="screen" />
    	<!-- AIR-Box mod addition - ends here -->
    Find:
    Code:
    echo '<img src="'.$filename.'" /><br>';
    Replace With:
    Code:
    echo '<a href="'.$url.$filename.'" rel="lightbox[gallery]"><img class="postimage" src="'.$url.$filename.'" /></a><br>';
    Adjusting Image Width
    Code:
    To set image sizes, open airbox.js
     at line 22:              if (pic.width > 640)
     
     change 640 to desired number of pixel for minimum width of images to be resized. 
    In this case images that are less than 640px wide won't be resized, 
    images that are more than 640px wide will be resized to the value you can assign at line 14.(See below). 
    Adjust it for your layout width.
     
     at line 24:               pic.setAttribute('width','640')
     
     change 640 to desired number of pixel for width of resized images.
     Adjust it for your layout width.
     
      As an alternative you can control width relative to document size. Read line 26.
    Extract zip and upload included files to your gallery directory
    Attached Files Attached Files
    Last edited by Jedi Knight; 12-11-2008 at 01:55 PM.

  • Users who have thanked Jedi Knight for this post:

    LJackson (12-11-2008)

  • #6
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,088
    Thanks
    296
    Thanked 12 Times in 12 Posts
    this code looks very useful, i may use it for a possible future project if thats ok?

    cheers
    Luke

  • #7
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by LJackson View Post
    this code looks very useful, i may use it for a possible future project if thats ok?

    cheers
    Luke
    It's definitely ok with me. I hope you have as much fun with it as I am.

    I'm still trying to display the images in 3 vertical columns.
    Right now I have 1 vertical column.

  • #8
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,088
    Thanks
    296
    Thanked 12 Times in 12 Posts
    cool thanks,

    have you uploaded your page your webspace yet? if so can i have the web address so i can have a look at it and hopefully recommend a way to get 3 columns

    cheers

  • #9
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by LJackson View Post
    cool thanks,

    have you uploaded your page your webspace yet? if so can i have the web address so i can have a look at it and hopefully recommend a way to get 3 columns

    cheers
    I set up a demo for you.
    Code:
    http://valorsolo.com/demo/gallery.php

  • #10
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,088
    Thanks
    296
    Thanked 12 Times in 12 Posts
    looks cool mate, how are your images stored are you using the method above that lxculango mentioned?

  • #11
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    All image, flash and audio files are uploaded to the same directory.
    Then, I use lxculango code above on 3 different files, music.php flash.php and gallery.php.
    All files only fetching their respective file types.
    All I did from there was dress it up with the AIR mod for the gallery.php and I used this player for music.php.
    Code:
    <script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>
    The browser takes care of the swf in flash.php.

    It was alot easier than I thought it was going to be when I started.

  • #12
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,088
    Thanks
    296
    Thanked 12 Times in 12 Posts
    ok what i would suggest, and its by no means the best or the quickest way but i would use a combination of css and php to do as you want, the only small worry i would have at the moment is that because your pics arnt all the same size it might look untidy if you were to go down the css root (it may not we'll have to wait and see)

    here is a quick example of what i mean:

    PHP Code:
    <?php




    $dir 
    'images/'// directory of your images
    $dh opendir($dir);
    if(
    $dh){

    echo 
    '<div class="container">';
    while(
    $filename readdir($dh)){
    if(
    strpos($filename,'.jpg') >|| strpos($filename,'.jpeg') >|| strpos($filename,'.gif') >|| strpos($filename,'.png') >0){

    echo 
    '<div class="imgcontainer">';
    echo 
    '<img src="'.$filename.'" />';
    echo 
    '</div>';

    }

    }
    echo
    '</div>';
    ?>
    see ive inserted some divs above i have included these in my stylesheet using the following code:

    Code:
    .imgcontainer{
    	width:250px;
    	height:200px;
    	float:left;
    	margin:5px;
    	border:1px solid #9999FF;
    	text-align:center;
    	}
    .container{
    	width:750px;
    	height:800px;
    	float:left;
    	}
    and this gives me this page(unfortunatly my images arnt loading up for some reason.)

    this would be the best way that i can recommend, if you require any help with this i'd gladly help, but its getting late now and i'll be back tomorrow.

    best of luck
    Luke

  • Users who have thanked LJackson for this post:

    Jedi Knight (12-12-2008)

  • #13
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    I had to do some minor adjustments, but it work out very well.
    Thanks for your help.

  • #14
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,088
    Thanks
    296
    Thanked 12 Times in 12 Posts
    No problems mate glad to of been able to help

  • #15
    Regular Coder
    Join Date
    Feb 2008
    Posts
    119
    Thanks
    23
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by Jedi Knight View Post
    I set up a demo for you.
    Code:
    http://valorsolo.com/demo/gallery.php
    I've been tweaking this a little, drop back by and see if it works any better.
    I was playing with some dynamic frames and stuff, but it was too buggy, so I quit while I was ahead.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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