Enkelt integrert bildegalleri med lightbox?

[Andreaz69]

Hei,

Jeg holder på med et lite prosjekt, og har mange idéer i hodet, men sliter med å få det ned "på papiret".

Jeg forsøker å integrere et enkelt bildegalleri inn i en eksisterende html side. Eneste er at jeg ønsker lightbox. Liker utseende/oppførsel.

Har forsøkt å integrere galleri med lightbox inn i siden min, men ikke lykkes.

Ser helt OK ut når jeg kjører det solo.

Måten lightbox oppfører seg her lightbox-oppførsel liker jeg godt. Spretter opp med en gang, og lukker seg uansett hvor man trykker. Genialt Liker ikke at hele siden skal bli sort, og lightbox skal bruke "en evighet" på å laste frem bilde..

 

Ikke lett å forklare slik ting, men kom med spørsmål om det er noe jeg trenger å forklare bedre. Lykkelig for all hjelp jeg kan få.

[MikkelRev]

Plogger er enkelt å integrere i designet ditt. Det kan også brukes med lightbox.

[Thomas.]

Du laster ned lightbox herifra, og her ser du mange exempler på hvordan det brukes på en nettside.

[Andreaz69]

Takker for responsen så langt. Kommer tilbake med info/spørsmål når det er implentert

[sxxxe83]

Dersom du skal ha dette i en løkke der flere bilder skal "spyttes" ut:

<?
$path = 'images/yatzy';
       foreach (glob("{$path}/{*.jpg,*.JPG,*.jpeg,*.JPEG}", GLOB_BRACE) as $file) {

        // Filename only
	$path_parts = pathinfo($file);
	$filetitle = $path_parts['filename'];

	echo "<a href='{$file}' rel='lightbox[Yatzy]' title='{$filetitle}'> <img src='thumbs.php?src={$file}&mw=120&mh=90' alt='{$filetitle}' width='100' height='70' /></a> \n";
} 
?>	

 

I dette eksempelet bruker jeg en fil kalt "thumbs.php" for å generere thumbnails. Veldig enkelt, lite high tech.

 

# ———————————————————————-
# DFN Thumbnailer
# http://www.digifuzz.net
# [email protected]
# ———————————————————————-

$image_file = $_GET['src'];
$MAX_WIDTH  = $_GET['mw'];
$MAX_HEIGHT = $_GET['mh'];

global $img;

# No Image?  No go.
if(!$image_file || $image_file == "" )    {
   die( "NO FILE FOUND.");
}      

# if no max width is set, set one.
if( !$MAX_WIDTH || $MAX_WIDTH == "" ) {
   $MAX_WIDTH="150";
}      

# if not max height is set, set one.
if( !$MAX_HEIGHT || $MAX_HEIGHT == "" ) {
   $MAX_HEIGHT="150";
}      

# Get image location
$image_path = $image_file;

# Load image
$img = null;
$ext = strtolower(end(explode('.', $image_path)));

if ($ext == 'jpg' || $ext == 'jpeg') {
   $img = @imagecreatefromjpeg($image_path);

} elseif ($ext == 'png') {
   $img = @imagecreatefrompng($image_path);

} elseif ($ext == 'gif') {

   # Only if your version of GD includes GIF support
   $img = @imagecreatefromgif($image_path);
}

# If an image was successfully loaded, test the image for size
if ($img) {

   # Get image size and scale ratio
   $width = imagesx($img);
   $height = imagesy($img);
   $scale = min($MAX_WIDTH/$width, $MAX_HEIGHT/$height);

   # If the image is larger than the max shrink it
   if ($scale < 1) {

       $new_width = floor($scale*$width);
          $new_height = floor($scale*$height);

       # Create a new temporary image    
       $tmp_img = imagecreatetruecolor($new_width, $new_height);

       # Copy and resize old image into new image
       imagecopyresampled($tmp_img, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
       imagedestroy($img);
       $img = $tmp_img;        
   }
}


# Create error image if necessary
if (!$img) {

   $img = imagecreate($MAX_WIDTH, $MAX_HEIGHT);
   imagecolorallocate($img,255,255,255);

   $c = imagecolorallocate($img,255,0,0);

   imageline($img,0,0,$MAX_WIDTH,$MAX_HEIGHT,$c);
   imageline($img,$MAX_WIDTH,0,0,$MAX_HEIGHT,$c);

}

# Display the image
header("Content-type: image/jpeg");
imagejpeg($img);
imagedestroy($img);
imageDestroy($tmp_img);

?>