PHP - Php Image Gallery

Lets say ive got a function like this one
Code: [Select]
function getPictures() {
global $max_width, $max_height;
if ( $handle = opendir(".") ) {
$lightbox = rand();
echo '<ul id="pictures">';
while ( ($file = readdir($handle)) !== false ) {
if ( !is_dir($file) ) {
$split = explode('.', $file);
$ext = $split[count($split) - 1];
if ( ($type = getPictureType($ext)) == '' ) {
continue;
}
if ( ! is_dir('thumbs') ) {
mkdir('thumbs');
}
if ( ! file_exists('thumbs/'.$file) ) {
if ( $type == 'jpg' ) {
$src = imagecreatefromjpeg($file);
} else if ( $type == 'png' ) {
$src = imagecreatefrompng($file);
} else if ( $type == 'gif' ) {
$src = imagecreatefromgif($file);
}
if ( ($oldW = imagesx($src)) < ($oldH = imagesy($src)) ) {
$newW = $oldW * ($max_width / $oldH);
$newH = $max_height;
} else {
$newW = $max_width;
$newH = $oldH * ($max_height / $oldW);
}
$new = imagecreatetruecolor($newW, $newH);
imagecopyresampled($new, $src, 0, 0, 0, 0, $newW, $newH, $oldW, $oldH);
if ( $type == 'jpg' ) {
imagejpeg($new, 'thumbs/'.$file);
} else if ( $type == 'png' ) {
imagepng($new, 'thumbs/'.$file);
} else if ( $type == 'gif' ) {
imagegif($new, 'thumbs/'.$file);
}
imagedestroy($new);
imagedestroy($src);
}
echo '<li><a href="'.$file.'" rel="lightbox['.$lightbox.']">';
echo '<img src="thumbs/'.$file.'" alt="" />';
echo '</a></li>';
}
}
echo '</ul>';
}
}What it does is:
It checks for files(images) in a directory, check for file types jpg, png or gif cuz I work on gd library and it supports only these 3 type of images and make thumbnails. My problem is I cant change the directory of images, after I do that I just got error or it doesnt read images at all. I tried

Code: [Select]
$dir = "/galerija/";
if ( $handle = opendir($dir) )
But nothing happens, it just leaves me blank space(as I said above it doesnt read images at all)

hello experts ! im new to php script, hope u guys able to help. thanks in advance  . I'm following a tutorial from this site: http://www.anyexample.com/programming/php/php_mysql_example__image_gallery_(blob_storage).xml

and i run the code, error occur    (i highlighted line 27) :
Parse error: syntax error, unexpected T_STRING in C:\xampp\htdocs\testing.php on line 27

This is my php script:
 <?php
$db_host = 'localhost'; // don't forget to change
$db_user = 'root';
$db_pwd = '123456';


$database = 'test';
$table = 'ae_gallery';
// use the same name as SQL table

$password = '123';
// simple upload restriction,
// to disallow uploading to everyone



////create sql-table
CREATE TABLE 'ae_gallery' (
  'id' int(11) NOT NULL AUTO_INCREMENT,
  'title' varchar(64) character SET utf8 NOT NULL,
  'ext' varchar( 8 ) character SET utf8 NOT NULL,
  'image_time' timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  'data' mediumblob NOT NULL,
  PRIMARY KEY  (`id`)
);




if (!mysql_connect($db_host, $db_user, $db_pwd))
    die("Can't connect to database");

if (!mysql_select_db($ae_gallery))
    die("Can't select database");


// This function makes usage of
// $_GET, $_POST, etc... variables
// completly safe in SQL queries
function sql_safe($s)
{
    if (get_magic_quotes_gpc())
        $s = stripslashes($s);

    return mysql_real_escape_string($s);
}

// If user pressed submit in one of the forms
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
    // cleaning title field
    $title = trim(sql_safe($_POST['title']));

    if ($title == '') // if title is not set
        $title = '(empty title)';// use (empty title) string

    if ($_POST['password'] != $password)  // cheking passwors
        $msg = 'Error: wrong upload password';
    else
    {
        if (isset($_FILES['photo']))
        {
            @list(, , $imtype, ) = getimagesize($_FILES['photo']['tmp_name']);
            // Get image type.
            // We use @ to omit errors

            if ($imtype == 3) // cheking image type
                $ext="png";   // to use it later in HTTP headers
            elseif ($imtype == 2)
                $ext="jpeg";
            elseif ($imtype == 1)
                $ext="gif";
            else
                $msg = 'Error: unknown file format';

            if (!isset($msg)) // If there was no error
            {
                $data = file_get_contents($_FILES['photo']['tmp_name']);
                $data = mysql_real_escape_string($data);
                // Preparing data to be used in MySQL query

                mysql_query("INSERT INTO {$table}
                                SET ext='$ext', title='$title',
                                    data='$data'");

                $msg = 'Success: image uploaded';
            }
        }
        elseif (isset($_GET['title']))      // isset(..title) needed
            $msg = 'Error: file not loaded';// to make sure we've using
                                            // upload form, not form
                                            // for deletion


        if (isset($_POST['del'])) // If used selected some photo to delete
        {                         // in 'uploaded images form';
            $id = intval($_POST['del']);
            mysql_query("DELETE FROM {$table} WHERE id=$id");
            $msg = 'Photo deleted';
        }
    }
}
elseif (isset($_GET['show']))
{
    $id = intval($_GET['show']);

    $result = mysql_query("SELECT ext, UNIX_TIMESTAMP(image_time), data
                             FROM {$table}
                            WHERE id=$id LIMIT 1");

    if (mysql_num_rows($result) == 0)
        die('no image');

    list($ext, $image_time, $data) = mysql_fetch_row($result);

    $send_304 = false;
    if (php_sapi_name() == 'apache') {
        // if our web server is apache
        // we get check HTTP
        // If-Modified-Since header
        // and do not send image
        // if there is a cached version

        $ar = apache_request_headers();
        if (isset($ar['If-Modified-Since']) && // If-Modified-Since should exists
            ($ar['If-Modified-Since'] != '') && // not empty
            (strtotime($ar['If-Modified-Since']) >= $image_time)) // and grater than
            $send_304 = true;                                     // image_time
    }


    if ($send_304)
    {
        // Sending 304 response to browser
        // "Browser, your cached version of image is OK
        // we're not sending anything new to you"
        header('Last-Modified: '.gmdate('D, d M Y H:i:s', $ts).' GMT', true, 304);

        exit(); // bye-bye
    }

    // outputing Last-Modified header
    header('Last-Modified: '.gmdate('D, d M Y H:i:s', $image_time).' GMT',
            true, 200);

    // Set expiration time +1 year
    // We do not have any photo re-uploading
    // so, browser may cache this photo for quite a long time
    header('Expires: '.gmdate('D, d M Y H:i:s',  $image_time + 86400*365).' GMT',
            true, 200);

    // outputing HTTP headers
    header('Content-Length: '.strlen($data));
    header("Content-type: image/{$ext}");

    // outputing image
    echo $data;
    exit();
}
?>
<html><head>
<title>MySQL Image Gallery Example</title>
</head>
<body>
<?php
if (isset($msg)) // this is special section for
                 // outputing message
{
?>
<p style="font-weight: bold;"><?=$msg?>
<br>
<a href="<?=$PHP_SELF?>">reload page</a>
<!-- I've added reloading link, because
     refreshing POST queries is not good idea -->
</p>
<?php
}
?>
<h1><i>Image gallery</i></h1>
<h2>Uploaded images:</h2>
<form action="<?=$PHP_SELF?>" method="post">
<!-- This form is used for image deletion -->

<?php
$result = mysql_query("SELECT id, image_time, title FROM {$table} ORDER BY id DESC");
if (mysql_num_rows($result) == 0) // table is empty
    echo '<ul><li>No images loaded</li></ul>';
else
{
    echo '<ul>';
    while(list($id, $image_time, $title) = mysql_fetch_row($result))
    {
        // outputing list
        echo "<li><input type='radio' name='del' value='{$id}'>";
        echo "<a href='{$PHP_SELF}?show={$id}'>{$title}</a> &ndash; ";
        echo "<small>{$image_time}</small></li>";
    }

    echo '</ul>';

    echo '<label for="password">Password:</label><br>';
    echo '<input type="password" name="password" id="password"><br><br>';

    echo '<input type="submit" value="Delete selected">';
}
?>

</form>
<h2>Upload new image:</h2>
<form action="<?=$PHP_SELF?>" method="POST" enctype="multipart/form-data">
<label for="title">Title:</label><br>
<input type="text" name="title" id="title" size="64"><br><br>

<label for="photo">Photo:</label><br>
<input type="file" name="photo" id="photo"><br><br>

<label for="password">Password:</label><br>
<input type="password" name="password" id="password"><br><br>

<input type="submit" value="upload">
</form>

Hi i have this form which meant to upload the create an album but some how doesnt not work can some1 help please i use 3 files here they are addalbum.php is where is not working  the other files are just the database config and functions.php the error messages from the addalbum.php functions


addalbum.php
 require_once '../library/config.php';
require_once '../library/functions.php';

if(isset($_POST['txtName']))
{
   $albumName = $_POST['txtName'];
   $albumDesc = $_POST['mtxDesc'];

   $imgName = $_FILES['fleImage']['name'];
   $tmpName = $_FILES['fleImage']['tmp_name'];

   // we need to rename the image name just to avoid
   // duplicate file names
   // first get the file extension
   $ext = strrchr($imgName, ".");

   // then create a new random name
   $newName = md5(rand() * time()) . $ext;

   // the album image will be saved here
   $imgPath = ALBUM_IMG_DIR . $newName;

   // resize all album image
   $result = createThumbnail($tmpName, $imgPath, THUMBNAIL_WIDTH);

   if (!$result) {
      echo "Error uploading file";
      exit;
   }

   if (!get_magic_quotes_gpc()) {
      $albumName = addslashes($albumName);
      $albumDesc = addslashes($albumDesc);
   }

   $query = "INSERT INTO tbl_album (al_name, al_description, al_image, al_date)
   VALUES ('$albumName', '$albumDesc', '$newName', NOW())";

   mysql_query($query)
   or die('Error, add album failed : ' .    mysql_error());

   // the album is saved, go to the album list
   echo "<script>window.location.href='index.php?page=list-album';</script>";
   exit;
}
<!-- google_ad_section_end -->



 <FORM enctype="multipart/form-data" action="addalbum.php" method="post">
    <P>
    <LABEL for="firstname">al_name: </LABEL>
              <INPUT type="text" name="form" id="albumName"><BR>
    <LABEL for="lastname">al_description: </LABEL>
              <INPUT type="text" name="form" id="albumDesc"><BR>
    <LABEL for="email">al_date: </LABEL>
              <INPUT type="text"  id="NOW"><BR>
     <input type="file" name="newName" class="input">
<p><input type="submit" name="submit" value="Upload" class="submit"></p>

    </P>
 </FORM>
 


funtions.php
<?php

/*

Upload an image and create the thumbnail. The thumbnail is stored

under the thumbnail sub-directory of $uploadDir.

Return the uploaded image name and the thumbnail also.

*/

function uploadImage($inputName, $uploadDir)

{


$image     = $_FILES[$inputName];

$imagePath = '';

$thumbnailPath = '';

// if a file is given

if (trim($image['tmp_name']) != '') {

$ext = substr(strrchr($image['name'], "."), 1);

// generate a random new file name to avoid name conflict

// then save the image under the new file name

$imagePath = md5(rand() * time()) . ".$ext";

$result    = move_uploaded_file($image['tmp_name'], $uploadDir . $imagePath);

if ($result) {

// create thumbnail

$thumbnailPath =  md5(rand() * time()) . ".$ext";

$result = createThumbnail($uploadDir . $imagePath, $uploadDir . 'thumbnail/' . $thumbnailPath, THUMBNAIL_WIDTH);

// create thumbnail failed, delete the image

if (!$result) {

unlink($uploadDir . $imagePath);

$imagePath = $thumbnailPath = '';

} else {

$thumbnailPath = $result;

}

} else {

// the image cannot be uploaded

$imagePath = $thumbnailPath = '';

}

}

return array('image' => $imagePath, 'thumbnail' => $thumbnailPath);

}

/*

Create a thumbnail of $srcFile and save it to $destFile.

The thumbnail will be $width pixels.

*/

function createThumbnail($srcFile, $destFile, $width, $quality = 75)

{

$thumbnail = '';

if (file_exists($srcFile)  && isset($destFile))

{

$size        = getimagesize($srcFile);

$w           = number_format($width, 0, ',', '');

$h           = number_format(($size[1] / $size[0]) * $width, 0, ',', '');
$thumbnail =  copyImage($srcFile, $destFile, $w, $h, $quality);

}

// return the thumbnail file name on sucess or blank on fail

return basename($thumbnail);

}

/*

Copy an image to a destination file. The destination

image size will be $w X $h pixels

*/

function copyImage($srcFile, $destFile, $w, $h, $quality = 75)

{

   $tmpSrc     = pathinfo(strtolower($srcFile));

   $tmpDest    = pathinfo(strtolower($destFile));

   $size       = getimagesize($srcFile);

   if ($tmpDest['extension'] == "gif" || $tmpDest['extension'] == "jpg")

   {

      $destFile  = substr_replace($destFile, 'jpg', -3);

      $dest      = imagecreatetruecolor($w, $h);

      //imageantialias($dest, TRUE);

   } elseif ($tmpDest['extension'] == "png") {

      $dest = imagecreatetruecolor($w, $h);

      //imageantialias($dest, TRUE);

   } else {

     return false;

   }

   switch($size[2])

   {

      case 1:       //GIF

          $src = imagecreatefromgif($srcFile);

          break;

      case 2:       //JPEG

          $src = imagecreatefromjpeg($srcFile);

          break;

      case 3:       //PNG

          $src = imagecreatefrompng($srcFile);

          break;

      default:

          return false;

          break;

   }

   imagecopyresampled($dest, $src, 0, 0, 0, 0, $w, $h, $size[0], $size[1]);

   switch($size[2])

   {

      case 1:

      case 2:

          imagejpeg($dest,$destFile, $quality);

          break;

      case 3:

          imagepng($dest,$destFile);

   }

   return $destFile;

}

/*

Check if the user is logged in or not

*/

function checkLogin()

{

if (!isset($_SESSION['isLogin']) || $_SESSION['isLogin'] == false) {

header('Location: login.php');

exit;

}

}

/*

Create the link for moving from one page to another

*/

function getPagingLink($totalResults, $pageNumber, $itemPerPage = 10, $strGet = '')

{

$pagingLink    = '';

$totalPages    = ceil($totalResults / $itemPerPage);

// how many link pages to show

$numLinks      = 10;

// create the paging links only if we have more than one page of results

if ($totalPages > 1) {

$self = 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['PHP_SELF'] ;

// print 'previous' link only if we're not

// on page one

if ($pageNumber > 1) {

$page = $pageNumber - 1;

if ($page > 1) {

$prev = " <a href=\"$self?pageNum=$page&$strGet\">[Prev]</a> ";

} else {

$prev = " <a href=\"$self?$strGet\">[Prev]</a> ";

}

$first = " <a href=\"$self?$strGet\">[First]</a> ";

} else {

$prev  = ''; // we're on page one, don't show 'previous' link

$first = ''; // nor 'first page' link

}

// print 'next' link only if we're not

// on the last page

if ($pageNumber < $totalPages) {

$page = $pageNumber + 1;

$next = " <a href=\"$self?pageNum=$page&$strGet\">[Next]</a> ";

$last = " <a href=\"$self?pageNum=$totalPages&$strGet\">[Last]</a> ";

} else {

$next = ''; // we're on the last page, don't show 'next' link

$last = ''; // nor 'last page' link

}

$start = $pageNumber - ($pageNumber % $numLinks) + 1;

$end   = $start + $numLinks - 1;

$end   = min($totalPages, $end);

$pagingLink = array();

for($page = $start; $page <= $end; $page++) {

if ($page == $pageNumber) {

$pagingLink[] = " $page ";   // no need to create a link to current page

} else {

if ($page == 1) {

$pagingLink[] = " <a href=\"$self?$strGet\">$page</a> ";

} else {

$pagingLink[] = " <a href=\"$self?pageNum=$page&$strGet\">$page</a> ";

}

}

}

$pagingLink = implode(' | ', $pagingLink);

// return the page navigation link

$pagingLink = $first . $prev . $pagingLink . $next . $last;

}

return $pagingLink;

}

/*

Display the breadcrumb navigation on top of the gallery page

*/

function showBreadcrumb()

{

if (isset($_GET['album'])) {

$album = $_GET['album'];

$sql  = "SELECT al_name

                FROM tbl_album

        WHERE al_id = $album";

$result = mysql_query($sql) or die('Error, get album name failed. ' . mysql_error());

$row = mysql_fetch_assoc($result);

echo ' > <a href="index.php?page=list-image&album=' . $album . '">' . $row['al_name'] . '</a>';

if (isset($_GET['image'])) {

$image = $_GET['image'];

$sql  = "SELECT im_title

FROM tbl_image

WHERE im_id = $image";

$result = mysql_query($sql) or die('Error, get image name failed. ' . mysql_error());

$row = mysql_fetch_assoc($result);

echo ' > <a href="index.php?page=image-detail&album=' . $album . '&image=' . $image . '">' . $row['im_title'] . '</a>';

}

}

}

?>

config.php

<?php

session_start();

// db properties




$dbhost = 'localhost';

$dbuser = 'root';

$dbpass = '';    

$dbname = 'rock';

// an album can have an image used as thumbnail

// we save the album image here

define('ALBUM_IMG_DIR', 'C:/webroot/image');

// all images inside an album are stored here

define('GALLERY_IMG_DIR', 'C:/webroot/gallery/images/gallery/');

// When we upload an image the thumbnail is created on the fly

// here we set the thumbnail width in pixel. The height will

// be adjusted proportionally

define('THUMBNAIL_WIDTH', 100);

// make a connection to mysql here

$conn = mysql_connect ($dbhost, $dbuser, $dbpass) or die ("I cannot connect to the database because: " . mysql_error());

mysql_select_db ($dbname) or die ("I cannot select the database '$dbname' because: " . mysql_error());

?> 

I'm tired and just about given up. Can anybody help me?


Code: [Select]
<?php
$objConnect = mysql_connect("localhost","","root") or die(mysql_error());
$objDB = mysql_select_db("sdf");
$pic2 = "SELECT * FROM images";
if (!isset($_GET['Page'])) $_GET['Page']='0';
$pic1 = mysql_query($pic2);
$Num_Rows = mysql_num_rows($pic1);
$Per_Page = 16;   // Per Page
$Page = $_GET["Page"];
if(!$_GET["Page"])
{$Page=1;}
$Prev_Page = $Page-1;
$Next_Page = $Page+1;
$Page_Start = (($Per_Page*$Page)-$Per_Page);
if($Num_Rows<=$Per_Page)
{$Num_Pages =1;}
else if(($Num_Rows % $Per_Page)==0)
{$Num_Pages =($Num_Rows/$Per_Page) ;}
else
{$Num_Pages =($Num_Rows/$Per_Page)+1;
$Num_Pages = (int)$Num_Pages;}
$pic2 .=" order  by thumbnailID ASC LIMIT $Page_Start , $Per_Page";
$pic1  = mysql_query($pic2);
$cell = 0;
$link1 = "SELECT * FROM images";
$result_link1 = mysql_query($link1);
$link = mysql_fetch_array($result_link1);
$alt1 = "SELECT * FROM images";
$alt = mysql_fetch_array(mysql_query($alt1));
echo '
    <div id="tablediv">
      <table border="0" cellpadding="17" cellspacing="0" class="table">
        <tr>';

  while($pic = mysql_fetch_array($pic1)) {

    if($cell % 4 == 0) {
      echo '</tr><tr>';
    }

    if($cell == 2) {
      echo '
        <td>
          fillerspace
        </td>';
    } elseif ($cell == 3) {
      echo '
        <td>
Fillerspace2
        </td>';
    } else {
      echo '
        <td>
          <a href="/' . $link["link"] . '.php">
            <div class="image">
              <img src="https://s3.amazonaws.com/image/' . $pic["pic"] . '.png" 
                   alt="' . $alt["alt"] . '" 
                   height="200" 
                   width="200" 
              />
            </div>
          </a>
        </td>'; 
    }
    $cell++;
  }
  echo '</tr></table></div>';
?>
Basically, there are a couple of faults with this code. I didn't include the pagination part, but there is, for simplicity. But right now, when I insert a new record such as this:
INSERT INTO `images` VALUES (' ', 'blog', 'yo', '6', 'hello', '2011-02-15T07:24:17Z')
The columns go in order  of thumbnailID, folder, link, pic, alt, and time.^^^^^^^^

several problem arises. One, the new record is not displayed as the newest entry on my site. So the record is actually placed in one of the paginated pages. How can I reverse the order? The other thing is, it seems like my pic column is the only thing being understood. You see, when I inserted the above record, I checked my site and saw the pic 6, but the link wasn't 'yo', and the alt wasn't 'hello'. Why is that?

By the way, my host is awfully terrible. Maybe it's just having a major delay in reading the link and alt? I don't know. That would be the only reasonable answer, unless my code is off.

Thank you, and I'll check 10hours from now.

This topic has been moved to Third Party PHP Scripts.

http://www.phpfreaks.com/forums/index.php?topic=348417.0

This topic has been moved to Miscellaneous.

http://www.phpfreaks.com/forums/index.php?topic=332275.0

Hi, I am trying to make a simple thumbnail gallery where you upload an image, the image gets resized, a thumbnail is created in the "images/small/" directory, and the main images are in the "images/" directory.

I need to somehow read from both directories, and do an image link with  the thumbnail linking to the larger image. I think that means displaying from two directories, I don't know how to do that, please any help greatly appreciated. Thank you.

here is my code so far

Code: [Select]
<?php 
error_reporting(0);

$change="";
$abc="";


 define ("MAX_SIZE","400");
 function getExtension($str) {
         $i = strrpos($str,".");
         if (!$i) { return ""; }
         $l = strlen($str) - $i;
         $ext = substr($str,$i+1,$l);
         return $ext;
 }

 $errors=0;
  
 if($_SERVER["REQUEST_METHOD"] == "POST")
 {
  $image =$_FILES["file"]["name"];
$uploadedfile = $_FILES['file']['tmp_name'];
     
 
  if ($image) 
  {
 
  $filename = stripslashes($_FILES['file']['name']);
 
   $extension = getExtension($filename);
  $extension = strtolower($extension);


 if (($extension != "jpg") && ($extension != "jpeg") && ($extension != "png") && ($extension != "gif")) 
  {

  $change='<div class="msgdiv">Unknown Image extension </div> ';
  $errors=1;
  }
  else
  {

 $size=filesize($_FILES['file']['tmp_name']);


if ($size > MAX_SIZE*1024)
{
$change='<div class="msgdiv">You have exceeded the size limit!</div> ';
$errors=1;
}


if($extension=="jpg" || $extension=="jpeg" )
{
$uploadedfile = $_FILES['file']['tmp_name'];
$src = imagecreatefromjpeg($uploadedfile);

}
else if($extension=="png")
{
$uploadedfile = $_FILES['file']['tmp_name'];
$src = imagecreatefrompng($uploadedfile);

}
else 
{
$src = imagecreatefromgif($uploadedfile);
}

echo $scr;

list($width,$height)=getimagesize($uploadedfile);

//**Original**//
//$newwidth=60;
//$newheight=($height/$width)*$newwidth;
 
//**Modified to use height instead of width**//
//$newheight=350;
//$newwidth=($width/$height)*$newheight; 

// **IF NOT resizing full image then just pass variables.**//
$newheight=$height;
$newwidth=$width; 
//***adjust tmp***//
$tmp=imagecreatetruecolor($newwidth,$newheight);
//Thumbs
$newheight1=180;
$newwidth1=($width/$height)*$newheight1;
//**Original**//
//$newwidth1=25;
//$newheight1=($height/$width)*$newwidth1;
$tmp1=imagecreatetruecolor($newwidth1,$newheight1);

imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);

imagecopyresampled($tmp1,$src,0,0,0,0,$newwidth1,$newheight1,$width,$height);


$filename = "images/". $_FILES['file']['name'];

$filename1 = "images/small/". $_FILES['file']['name'];



imagejpeg($tmp,$filename,100);

imagejpeg($tmp1,$filename1,100);

imagedestroy($src);
imagedestroy($tmp);
imagedestroy($tmp1);
}}

}

//If no errors registred, print the success message
 if(isset($_POST['Submit']) && !$errors) 
 {
 
   // mysql_query("update {$prefix}users set img='$big',img_small='$small' where user_id='$user'");
  $change=' <div class="msgdiv">Image Uploaded Successfully!</div>';
 }
 
?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"><head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<meta content="en-us" http-equiv="Content-Language">

    <title>picture demo</title>
   
   <link href=".css" media="screen, projection" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery_002.js"></script>
<script type="text/javascript" src="js/displaymsg.js"></script>
<script type="text/javascript" src="js/ajaxdelete.js"></script>
   

  <style type="text/css">
  .help
{
font-size:11px; color:#006600;
}
body {
     color: #000000;
 background-color:#999999 ;
    background:#999999 url(<?php echo $user_row['img_src']; ?>) fixed repeat top left;


font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;

}
.msgdiv{
width:759px;
padding-top:8px;
padding-bottom:8px;
background-color: #fff;
font-weight:bold;
font-size:18px;-moz-border-radius: 6px;-webkit-border-radius: 6px;
}
#container{width:763px;margin:0 auto;padding:3px 0;text-align:left;position:relative; -moz-border-radius: 6px;-webkit-border-radius: 6px; background-color:#FFFFFF }
</style>

  </head><body>
     <div align="center" id="err">
<?php echo $change; ?>  </div>
   <div id="space"></div>
   
 
 
 
 
  <div id="container" >
   
   <div id="con">
   
     
     
        <table width="502" cellpadding="0" cellspacing="0" id="main">
          <tbody>
            <tr>
              <td width="500" height="238" valign="top" id="main_right">

  <div id="posts">
  &nbsp;&nbsp;&nbsp;&nbsp;<img src="<?php echo $filename; ?>" />  &nbsp;&nbsp;&nbsp;&nbsp;<img src="<?php echo $filename1; ?>"  />
    <form method="post" action="" enctype="multipart/form-data" name="form1">
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
               <tr><Td style="height:25px">&nbsp;</Td></tr>
<tr>
          <td width="150"><div align="right" class="titles">Picture
            : </div></td>
          <td width="350" align="left">
            <div align="left">
              <input size="25" name="file" type="file" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10pt" class="box"/>
 
              </div></td>
 
        </tr>
<tr><Td></Td>
<Td valign="top" height="35px" class="help">Image maximum size <b>400 </b>kb</span></Td>
</tr>
<tr><Td></Td><Td valign="top" height="35px"><input type="submit" id="mybut" value="       Upload        " name="Submit"/></Td></tr>
        <tr>
          <td width="200">&nbsp;</td>
          <td width="200"><table width="200" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200" align="center"><div align="left"></div></td>
                <td width="100">&nbsp;</td>
              </tr>
          </table></td>
        </tr>
      </table>
</form>
 
 
 
 
  </div>
 
 
 
 
  </td>
           
            </tr>
          </tbody>
     </table>
     

     
   
</div>
       
  </div>
 

   
</body></html>

Hi
I am trying to build a site which has an image gallery with links on it. I want to list the the images in different ways and I have successfully made it work with a "shuffle"-script like this:

Code: [Select]
<?php 
$links[] = Array("../r/ahlens.html", "k/k.jpg");
$links[] = Array("../r/brothers.html", "k/k.jpg");
$links[] = Array("../r/hm.html", "k/k.jpg");
$links[] = Array("../r/kappahl.html", "k/k.jpg");
$links[] = Array("../r/mq.html", "k/k.jpg");
$links[] = Array("sida1.php", "k/l.jpg");
$links[] = Array("../r/kappahl.html", "k/k.jpg");
$links[] = Array("../r/mq.html", "k/k.jpg");
$links[] = Array("../r/nk.html", "k/k.jpg");

shuffle($links);

foreach($links as $link){
    echo "<a href=\"${link[0]}\" ><img src=\"${link[1]}\" class=\"randomImage\" /></a> ";  
}  
?>
It works fine and opens a new page when clicked.

Now I would like to make it listed by file name instead of shuffling. How do I do that without loosing the links? And can it be done with a Directory because there will be a lot more photos in the future?
(I would also like the link to pages to be opened in a nice popup. Can I implement that?)
Thanks in advance!

I have a very simple piece of code to create a grid based gallery. The thumbnails are loaded from a single directory and are name 1.jpg... 2.jpg... 3.jpg etc

At the moment the images appear to be loaded in randomly. I want them to load in numerically in terms of their filename. I know I may need to use 'sort' or 'natsort' but where in the code?

Thanks for any help you can give me

Code: [Select]
<?

$images = "Images/Bag Thumbs/"; # Location of small versions

$big    = "ruxxwomens.php?id="; # Location of big versions (assumed to be a subdir of above)

$cols   = 4; # Number of columns to display

if ($handle = opendir($images)) {
   while (false !== ($file = readdir($handle))) {
       if ($file != "." && $file != ".." && $file != rtrim($big,"/")) {
          $files[] = $file;
       }
   }
   closedir($handle);
}



$colCtr = 0;
echo '<table width="800" cellspacing="0" cellpadding="0" border="0"><tr>';
foreach($files as $file)
{
  if($colCtr %$cols == 0)

    echo '</tr><tr>';

  echo '<td align="center"><a href="' . $big . $file . '"><img src="' . $images . $file . '" cellspacing="0" cellpadding="0" border="0"></a></td>';

  $colCtr++;
}
echo '</table>' . "\r\n";

?>

Hi the file file upload whenever i upload an image to main directory it saves one image into photos folder and copy another into thumbs folder but whenever i upload image to a different album (not main directory) it doesnt copy the other image to thumbs folder what i'm i doing wrong

this is the line that i chose the folder...

function make_locations ($locs)
{
$html = '<select name="locations" class="input"><option value="0">-- Main Directory --</option>';
foreach ($locs AS $key => $value)
{
$html .= '<option value="' .$value['album_id']. '">' .addslashes($value['album_name']). '</option>';
}
$html .= '</select>';

return $html;
}


this is the whole code

<?php
/**
* create a sub album directory for photos
* to be stored in
*/
function create_album ($album_name, $sub_album = 0)
{
global $db;

$sql = "INSERT INTO " .ALBUMS_TABLE. "
(
album_name,
sub_album
)
VALUES
(
'" .addslashes($album_name). "',
" .intval($sub_album). "
)";

if ($db->query($sql))
{
return TRUE;
}
else
{
return FALSE;
}
}

/**
* get a list of sub albums
*/
function get_albums ($sub_album = 0)
{
global $db;

$sql = "SELECT *
FROM " .ALBUMS_TABLE. "
WHERE sub_album = " .intval($sub_album);

$db->query($sql);

// initialise album storage
$albums = array();
while ($row = $db->fetch())
{
$albums[] = $row;
}

return $albums;
}

/**
* get a list of photos within an album
*/
function get_photos ($album = 0)
{
global $db;

$sql = "SELECT *
FROM " .PHOTOS_TABLE. "
WHERE album_id = " .intval($album). "
ORDER BY photo_id ASC";

$db->query($sql);

// initialise album storage
$photos = array();
while ($row = $db->fetch())
{
$photos[] = $row;
}

return $photos;
}

/**
* get a large version of a particular photo
*/
function get_large ($photo, $album = 0, $next = '')
{
global $db, $template, $account_details;

// shall we get the next / previous photo
switch ($next)
{
case "next" :

$next_sql = "AND photo_id > " .intval($photo). " ORDER BY photo_id ASC";
break;

case "previous" :

$next_sql = "AND photo_id < " .intval($photo). " ORDER BY photo_id DESC";
break;

default :

$next_sql = "AND photo_id = " .intval($photo);
break;
}

$sql = "SELECT *
FROM " .PHOTOS_TABLE. "
WHERE album_id = " .intval($album). "
" .$next_sql. "
LIMIT 1";

$db->query($sql);
if ($db->num_rows() == 0)
{
return '';
}
else
{
$photo_info = $db->fetch();

// note the total directory
$location = 'photos/' .$photo_info['photo_proper'];

// now we need to resize
list($width, $height) = getimagesize($location);
if ($width < 300)
{
$new_width = $width;
$new_height = $height;
}
elseif ($width > $height)
{
$new_width = 300;
$new_height = $height * ($new_width / $width);
}
elseif ($width < $height)
{
$new_width = $width * ($new_height / $height);
$new_height = 300;
}

// work out the next link
$next = '<a href="portfolio.php?p=' .$photo_info['photo_id']. '&a=' .$photo_info['album_id']. '&next=next">Next</a>';
$previous = '<a href="portfolio.php?p=' .$photo_info['photo_id']. '&a=' .$photo_info['album_id']. '&next=previous">Previous</a>';

return '<div id="largephoto"><img src="' .$location. '" height="' .$new_height. '" width="' .$new_width. '" class="large"><br /><div id="prevnext">' .$previous. ' :: ' .$next. '</div></div>';
}
}

/**
* get an array of locations
*/
function get_locations ()
{
global $db;

// initialise array
$locations = array();

// select albums
$sql = "SELECT

album_id,
album_name

FROM " .ALBUMS_TABLE;

$db->query($sql);
while ($row = $db->fetch())
{
$locations[] = $row;

}

return $locations;
}

/**
* make the locations table
*/
function make_locations ($locs)
{
$html = '<select name="locations" class="input"><option value="0">-- Main Directory --</option>';
foreach ($locs AS $key => $value)
{
$html .= '<option value="' .$value['album_id']. '">' .addslashes($value['album_name']). '</option>';
}
$html .= '</select>';

return $html;
}

/**
* delete an album from the database
* does not delete the photos in it
*/
function delete_albums ($album_ids)
{
global $db;

if (sizeof($album_ids) > 0)
{
$sql = "DELETE FROM " .ALBUMS_TABLE. "
WHERE album_id IN (" .implode(',', $album_ids). ")";

if ($db->query($sql))
{
return TRUE;
}
}

return FALSE;
}

/**
* delete a set of photos
*/
function delete_photos ($photo_ids)
{
global $db;

if (sizeof($photo_ids) > 0)
{
// select photo names for deletion
$sql = "SELECT photo_proper
FROM " .PHOTOS_TABLE. "
WHERE photo_id IN (" .implode(',', $photo_ids). ")";

$db->query($sql);

$unlink_ids = array();
while ($row = $db->fetch())
{
$unlink_ids[] = $row['photo_proper'];
}

// now delete the photos
if (sizeof($unlink_ids) > 0)
{
$sql = "DELETE FROM " .PHOTOS_TABLE. "
WHERE photo_id IN (" .implode(',', $photo_ids). ")";

if ($db->query($sql))
{
// remove photo from directory
for ($i = 0; $i < sizeof($unlink_ids); $i++)
{
unlink("photos/" .$unlink_ids[$i]);
unlink("photos/thumbs/" .$unlink_ids[$i]);
}
return TRUE;
}
}
}

return FALSE;
}

/**
* upload a set of files
*/
function upload_files ($save_dir = '', $album = 0)
{
global $db;

// check the save dir is writable
if (!is_writable($save_dir))
{
return FALSE;
}

// specify allowed file types
$allowed_types = array (

'image/jpg',
'image/jpeg',
'image/pjpeg',
'image/gif'

);

// keep a list of uploaded files
$uploaded = array();

// store bytes uploaded
$total_bytes = 0;

// go through the list of files
while (list($key, $value) = each($_FILES['userfile']['name']))
{
// check file has been passed
if (!empty($value))
{
// find extension
$extension = substr($_FILES['userfile']['name'][$key], strpos($_FILES['userfile']['name'][$key],".") + 1);

// time + $key for name
$name = time(). "_" .$key. "." .$extension;

// save url
$add = $save_dir. "/" .$name;

if (move_uploaded_file($_FILES['userfile']['tmp_name'][$key], $add))
{
chmod($add, 0777);

// add photo to database
create_photo($_FILES['userfile']['name'][$key], $name, $album);
}
}
}

return TRUE;
}

/**
* insert photo details into the database
*/
function create_photo ($photo_name, $key_name, $album = 0)
{
global $db;

// get the filesize
if (!$size = filesize("photos/" .$key_name))
{
$size = 0;
}

// insert the photo in the database
$sql = "INSERT INTO " .PHOTOS_TABLE. "
(
photo_name,
photo_date,
photo_proper,
photo_size,
album_id
)
VALUES
(
'" .addslashes($photo_name). "',
" .time(). ",
'" .addslashes($key_name). "',
" .intval($size). ",
" .$album. "
)";

if ($db->query($sql))
{
return TRUE;
}
else
{
return FALSE;
}
}

/**
* get a complete raw copy of the directory
*/
function get_dir_contents ($dir)
{
// declare content array
$contents = array();

// check gallery exists
if (is_dir($dir))
{
if ($handle = opendir($dir))
{
while (FALSE !== ($file = readdir($handle)))
{
if ($file != '.' && $file != '..' && $file != 'thumbs')
{
if (file_exists($dir. '/thumbs/' .$file) || thumbnail($file, $dir. '/' .$file, $dir. '/thumbs'))
{
$contents[] = $dir. '/thumbs/' .$file;
}
else
{
$contents[] = 'no_image.gif';
}
}
}
}
}

return $contents;
}

/**
* create a thumbnail of a photo and store it
* in the thumbs directory
*/
function thumbnail ($filename, $source_file, $destination, $new_h = 75, $new_w = 75)
{
if (!is_file($source_file))
{
return FALSE;
}

// get the image details
list($old_w, $old_h, $type) = getimagesize($source_file);

// create source image
switch($type)
{
case 1:

$source = @imagecreatefromgif($source_file);
break;

case 2:

$source = @imagecreatefromjpeg($source_file);
break;

case 3:

$source = @imagecreatefrompng($source_file);
break;

default :

return FALSE;
}

// work out dimensions
if ($old_w < $old_h)
{
$thumb_w = $new_w;
$thumb_h = $old_h * ($new_h / $old_w);
}
elseif ($old_w > $old_h)
{
$thumb_w = $old_w * ($new_w / $old_h);
$thumb_h = $new_h;
}
elseif ($old_w == $old_h)
{
$thumb_w = $new_w;
$thumb_h = $new_h;
}
$thumb = @imagecreatetruecolor($thumb_w, $thumb_h);

// create image
imagecopyresized($thumb, $source, 0, 0, 0, 0, $thumb_w, $thumb_h, $old_w, $old_h);

// check we have a proper destination
if (!is_dir($destination))
{
mkdir($destination, 0777);
}

// save image
switch ($type)
{
case 1:
case 2:

imagejpeg($thumb, $destination. '/' .$filename);
break;

case 3:

imagepng($thumb, $destination. '/' .$filename);
break;
}

// memory saving
imagedestroy($thumb);
imagedestroy($source);

// thumbnail created successfully
return TRUE;
}

/**
* make the table to show the directories and photos
*/
function make_table ($list, $type, $row = 3)
{
// initialize gallery html array
$gallery_html = array();

// check if we have a list > 0
if ($size = sizeof($list))
{
switch ($type)
{
case "GALLERIES" :

$gallery_html[] = '<div id="galleries">';
break;

case "PHOTOS" :
case "RAW" :

$gallery_html[] = '<div id="photos">';
break;
}

// loop through list
for ($i = 0; $i < sizeof($list); $i++)
{
// shall we open a new list
if ($i % $row == 0)
{
$gallery_html[] = '<ul>';
}

// add to list
switch ($type)
{
case "GALLERIES" :

// create the delete link
$delete_link = '';
if ($_SESSION['logged_in'])
{
$delete_link = '[ <a href="admin.php?mode=deletealbum&a=' .$list[$i]['album_id']. '">Delete</a> ]';
}


$gallery_html[] = '<a href=portfolio.php?albums='.$list[$i]['album_id'].'><img src="folder.gif" class="directory"><br />' .addslashes($list[$i]['album_name']). '</a><br />' .$delete_link. '</li>';
break;

case "PHOTOS" :

// construct photo name
$name = $list[$i]['photo_proper'];

// construct location
$location = "photos/";

// create thumbnail
if (!file_exists($location. "/thumbs/" .$name))
{
thumbnail($name, $location. "/" .$name, $location. "/thumbs/");
}

// construct date
$date = '<div class="date">' .date("d/m G:ia", $list[$i]['photo_date']). '</div>';

// create the delete link
$delete_link = '';
if ($_SESSION['logged_in'])
{
$delete_link = '[ <a href="admin.php?mode=deletephoto&p=' .$list[$i]['photo_id']. '">Delete</a> ]';
}

// image information
list($width, $height) = getimagesize($location . $list[$i]['photo_proper']);

// add to the html
$gallery_html[] = '<li><a href="' .$location . $list[$i]['photo_proper']. '" rel="lightbox[racing]" title="Photos"><img src="' .$location. "/thumbs/" .$name. '" class="picture"><br />View</a><br />' .$delete_link. '</li>';
break;

case "RAW" :

$gallery_html[] = '<li><img src="' .$list[$i]. '" class="picture"></li>';
break;
}

// shall we close the list
if ( ($i + 1) % $row === 0 || ($i + 1) == $size)
{
$gallery_html[] = '</ul>';
}
}

$gallery_html[] = '</div>';
}

return implode('', $gallery_html);
}
?>

Hi guys, I was wondering how to do this, I have the code below where it gets my images from database and it lists them however I need to have a gallery like this http://www.cssplay.co.uk/menu/vertical-slide.html

                                <?php
echo '<table width="40">';

$images=mysql_query("SELECT * FROM img WHERE refimage='$ref'");

while($row = mysql_fetch_array($images))
{
$image=$row['image'];
$thumb=$row['thumb'];

            echo "<a href='$image' rel='lightbox[roadtrip]'><img src= '$thumb' width='60' height='40' alt='$title'>";
                
                } 

the code for CSS and html is as below:



<!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" xml:lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Stu Nicholls | CSSplay | A Vertical Scrolling Photograph Gallery</title>
<meta name="Author" content="Stu Nicholls" />
<meta name="Keywords" content= "cssplay, css, play, Cascading, Style, Sheets, experiments, demonstrations, gallery, galleries, photo, albums, slide, show, scrolling, vertical " />
<meta name="Description" content="CSS - Cutting edge Cascading Style Sheets. Experiments in CSS" />
<meta name="verify-v1" content="n3Dpx4NklZjg5p/Tq7h1q+Oj6Ml83crtkO/PwepVQ6Y=" />
<meta http-equiv="imagetoolbar" content="no" />


<link rel="meta" href="http://www.cssplay.co.uk/labels.rdf" type="application/rdf+xml" title="ICRA labels" />
<meta http-equiv="pics-Label" content='(pics-1.1 "http://www.icra.org/pics/vocabularyv03/" l gen true for "http://cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0)  gen true for "http://www.cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0))' />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://www.cssplay.co.uk/feed.xml" />

<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
<link rel="icon" href="../favicon.ico" type="image/ico" />
<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<link rel="stylesheet" media="all" type="text/css" href="../css/default.css" />

<style type="text/css">
/* defaults required for IE */
a, a:visited, a:hover, a:active, a:focus {color:#000;}

#holder {position:relative; background:transparent url(vertical-slide/photographer.jpg) 90px 0 no-repeat; margin-bottom:10px; width:750px; height:400px;}
#scrollbox {padding:0; margin:0; width:110px; list-style:none; height:360px; overflow:auto; float:right;}
#scrollbox li {float:left;}


#scrollbox a {display:block; color:#999; text-decoration:none; border:1px solid #fff; width:75px; height:56px; float:left; padding:5px; font-family:"trebuchet ms", sans-serif; font-size:24px; text-align:center;}

#scrollbox a.slidea {background:url(vertical-slide/pic1t.jpg) no-repeat center center;}
#scrollbox a.slideb {background:url(vertical-slide/pic2t.jpg) no-repeat center center;}
#scrollbox a.slidec {background:url(vertical-slide/pic3t.jpg) no-repeat center center;}
#scrollbox a.slided {background:url(vertical-slide/pic4t.jpg) no-repeat center center;}
#scrollbox a.slidee {background:url(vertical-slide/pic5t.jpg) no-repeat center center;}
#scrollbox a.slidef {background:url(vertical-slide/pic6t.jpg) no-repeat center center;}
#scrollbox a.slideg {background:url(vertical-slide/pic7t.jpg) no-repeat center center;}
#scrollbox a.slideh {background:url(vertical-slide/pic8t.jpg) no-repeat center center;}
#scrollbox a.slidei {background:url(vertical-slide/pic9t.jpg) no-repeat center center;}
#scrollbox a.slidej {background:url(vertical-slide/pic10t.jpg) no-repeat center center;}
#scrollbox a.slidek {background:url(vertical-slide/pic11t.jpg) no-repeat center center;}
#scrollbox a.slidel {background:url(vertical-slide/pic12t.jpg) no-repeat center center;}


#scrollbox a span {display:block; position:absolute; left:-9999px; top:0;}
#scrollbox a span img {border:0;}

#scrollbox a:hover {border:1px solid #888;}
#scrollbox a:hover span {width:480px; height:400px; left:90px; background:#fff; z-index:100;}

#scrollbox a:active {border:1px solid #000;}
#scrollbox a:focus {border:1px solid #000; outline:0;}

* html #scrollbox a:active span {width:480px; height:400px; top:0; left:90px; color:#000; background:#fff; z-index:-1;}
#scrollbox a:focus span {width:480px; height:400px; top:0; left:90px; color:#000; background:#fff; z-index:10; outline:0;}

</style>
</head>
 


/////////////////////////////// AND THIS IS THE HTML


<div id="holder">
<ul id="scrollbox">
<li><a class="slidea" href="#nogo"><span><img src="vertical-slide/pic1.jpg" alt="" /><br />Butterflies</span></a></li>
<li><a class="slideb" href="#nogo"><span><img src="vertical-slide/pic2.jpg" alt="" /><br />Shy</span></a></li>
<li><a class="slidec" href="#nogo"><span><img src="vertical-slide/pic3.jpg" alt="" /><br />Otter</span></a></li>
<li><a class="slided" href="#nogo"><span><img src="vertical-slide/pic4.jpg" alt="" /><br />Looking up</span></a></li>
<li><a class="slidee" href="#nogo"><span><img src="vertical-slide/pic5.jpg" alt="" /><br />Monkey</span></a></li>
<li><a class="slidef" href="#nogo"><span><img src="vertical-slide/pic6.jpg" alt="" /><br />Nuts</span></a></li>
<li><a class="slideg" href="#nogo"><span><img src="vertical-slide/pic7.jpg" alt="" /><br />Pelicans</span></a></li>

<li><a class="slideh" href="#nogo"><span><img src="vertical-slide/pic8.jpg" alt="" /><br />Kiwi</span></a></li>
<li><a class="slidei" href="#nogo"><span><img src="vertical-slide/pic9.jpg" alt="" /><br />Lizard</span></a></li>
<li><a class="slidej" href="#nogo"><span><img src="vertical-slide/pic10.jpg" alt="" /><br />Paddling</span></a></li>
<li><a class="slidek" href="#nogo"><span><img src="vertical-slide/pic11.jpg" alt="" /><br />Trees</span></a></li>
<li><a class="slidel" href="#nogo"><span><img src="vertical-slide/pic12.jpg" alt="" /><br />Butterfly</span></a></li>
</ul>
</div>





What i tried to do was to add div for each image listed from my database, but it wont work. Do you know whats the best way to embed this css to the php query i have?

thanks in advance guys.

hey guys i just got done integrating a  gallery script into my log in. it works great however i am trying to find out how to make it so only the logged in user can view there pics and not anyone else currently i have my table set up like this


ID
USERNAME
TIMESTAMP
CAPTION


is there any way possible  to make the images uploaded to the /gallery/ folder viewable by the logged in user and no one else

Hi guys, I am geeting images from a query but can not figure out how to show these images in a css gallery, I have found links of css gallery but dont know how to embed it or tell css to work with php,  i am  a newbie and cant figure it out

this is my php code where i get the images listed


echo '<table width="40">';

$images=mysql_query("SELECT * FROM img WHERE refimage='$ref'");

while($row = mysql_fetch_array($images))
{
$image=$row['image'];
$thumb=$row['thumb'];

          //  echo "<a href='$image' rel='lightbox[roadtrip]'><img src= '$thumb' width='60' height='40' alt='$title'>";
              echo "<img src= '$thumb' width='60' height='40' alt='$title'>";  
                } 


but if i want to have a css gallery like http://www.cssplay.co.uk/menu/vertical-slide.html which the css and html code is as below:

<!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" xml:lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Stu Nicholls | CSSplay | A Vertical Scrolling Photograph Gallery</title>
<meta name="Author" content="Stu Nicholls" />
<meta name="Keywords" content= "cssplay, css, play, Cascading, Style, Sheets, experiments, demonstrations, gallery, galleries, photo, albums, slide, show, scrolling, vertical " />
<meta name="Description" content="CSS - Cutting edge Cascading Style Sheets. Experiments in CSS" />
<meta name="verify-v1" content="n3Dpx4NklZjg5p/Tq7h1q+Oj6Ml83crtkO/PwepVQ6Y=" />
<meta http-equiv="imagetoolbar" content="no" />


<link rel="meta" href="http://www.cssplay.co.uk/labels.rdf" type="application/rdf+xml" title="ICRA labels" />
<meta http-equiv="pics-Label" content='(pics-1.1 "http://www.icra.org/pics/vocabularyv03/" l gen true for "http://cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0)  gen true for "http://www.cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0))' />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://www.cssplay.co.uk/feed.xml" />

<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
<link rel="icon" href="../favicon.ico" type="image/ico" />
<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<link rel="stylesheet" media="all" type="text/css" href="../css/default.css" />

<style type="text/css">
/* defaults required for IE */
a, a:visited, a:hover, a:active, a:focus {color:#000;}

#holder {position:relative; background:transparent url(vertical-slide/photographer.jpg) 90px 0 no-repeat; margin-bottom:10px; width:750px; height:400px;}
#scrollbox {padding:0; margin:0; width:110px; list-style:none; height:360px; overflow:auto; float:right;}
#scrollbox li {float:left;}


#scrollbox a {display:block; color:#999; text-decoration:none; border:1px solid #fff; width:75px; height:56px; float:left; padding:5px; font-family:"trebuchet ms", sans-serif; font-size:24px; text-align:center;}

#scrollbox a.slidea {background:url(vertical-slide/pic1t.jpg) no-repeat center center;}
#scrollbox a.slideb {background:url(vertical-slide/pic2t.jpg) no-repeat center center;}
#scrollbox a.slidec {background:url(vertical-slide/pic3t.jpg) no-repeat center center;}
#scrollbox a.slided {background:url(vertical-slide/pic4t.jpg) no-repeat center center;}
#scrollbox a.slidee {background:url(vertical-slide/pic5t.jpg) no-repeat center center;}
#scrollbox a.slidef {background:url(vertical-slide/pic6t.jpg) no-repeat center center;}
#scrollbox a.slideg {background:url(vertical-slide/pic7t.jpg) no-repeat center center;}
#scrollbox a.slideh {background:url(vertical-slide/pic8t.jpg) no-repeat center center;}
#scrollbox a.slidei {background:url(vertical-slide/pic9t.jpg) no-repeat center center;}
#scrollbox a.slidej {background:url(vertical-slide/pic10t.jpg) no-repeat center center;}
#scrollbox a.slidek {background:url(vertical-slide/pic11t.jpg) no-repeat center center;}
#scrollbox a.slidel {background:url(vertical-slide/pic12t.jpg) no-repeat center center;}


#scrollbox a span {display:block; position:absolute; left:-9999px; top:0;}
#scrollbox a span img {border:0;}

#scrollbox a:hover {border:1px solid #888;}
#scrollbox a:hover span {width:480px; height:400px; left:90px; background:#fff; z-index:100;}

#scrollbox a:active {border:1px solid #000;}
#scrollbox a:focus {border:1px solid #000; outline:0;}

* html #scrollbox a:active span {width:480px; height:400px; top:0; left:90px; color:#000; background:#fff; z-index:-1;}
#scrollbox a:focus span {width:480px; height:400px; top:0; left:90px; color:#000; background:#fff; z-index:10; outline:0;}

</style>
</head>
 


/////////////////////////////// AND THIS IS THE HTML


<div id="holder">
<ul id="scrollbox">
<li><a class="slidea" href="#nogo"><span><img src="vertical-slide/pic1.jpg" alt="" /><br />Butterflies</span></a></li>
<li><a class="slideb" href="#nogo"><span><img src="vertical-slide/pic2.jpg" alt="" /><br />Shy</span></a></li>
<li><a class="slidec" href="#nogo"><span><img src="vertical-slide/pic3.jpg" alt="" /><br />Otter</span></a></li>
<li><a class="slided" href="#nogo"><span><img src="vertical-slide/pic4.jpg" alt="" /><br />Looking up</span></a></li>
<li><a class="slidee" href="#nogo"><span><img src="vertical-slide/pic5.jpg" alt="" /><br />Monkey</span></a></li>
<li><a class="slidef" href="#nogo"><span><img src="vertical-slide/pic6.jpg" alt="" /><br />Nuts</span></a></li>
<li><a class="slideg" href="#nogo"><span><img src="vertical-slide/pic7.jpg" alt="" /><br />Pelicans</span></a></li>

<li><a class="slideh" href="#nogo"><span><img src="vertical-slide/pic8.jpg" alt="" /><br />Kiwi</span></a></li>
<li><a class="slidei" href="#nogo"><span><img src="vertical-slide/pic9.jpg" alt="" /><br />Lizard</span></a></li>
<li><a class="slidej" href="#nogo"><span><img src="vertical-slide/pic10.jpg" alt="" /><br />Paddling</span></a></li>
<li><a class="slidek" href="#nogo"><span><img src="vertical-slide/pic11.jpg" alt="" /><br />Trees</span></a></li>
<li><a class="slidel" href="#nogo"><span><img src="vertical-slide/pic12.jpg" alt="" /><br />Butterfly</span></a></li>
</ul>
</div>



thanks in advance guys

Hello, I have been trying to make this work for a while but nothing gives.

I'm a bit of a PHP noob, but not even a teacher at school could help me.


What I need is something like this page: http://marcandshawn.glrdmd.eu/ian/designers2.php?d=2

So when you click on a thumbnail, you see the bigger image above it, but stay on the same page.


My code:

Code: [Select]
<?php 
include('connection.php'); 
$query="SELECT * FROM person";
$result=mysql_query($query);                        
?>
^ reestablishing connections.

some html after that.
and for the chosen main image:
Code: [Select]
    <?php 
while($row = mysql_fetch_array( $result )) {  
echo "<img src='uploads/$row[image1]' style='max-width:300px;'/>"; 
    }  
?>
^ doesn't work. row[image1] contains the images.


Code: [Select]
    <?php 
 {  
  while($row = mysql_fetch_array( $result )){
echo "<a href='index.php?id=$row[id]' style='width:100px; height:100px;'/><img src='uploads/$row[thumb]' style='width:125px; height:90px; border:0px;' /></a>"; 
}
    }  
?>    
Supposed thumbnails.

If someone could help, it would be greatly appreciated.