foto's verkleinen
Hieronder heb ik een script en heb ik de regel
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\"
De tumbfolder veranderd in .$directory.$file op het eind, zodat dit script niet vanuit een tumbfolder uitleest en dat ik dus ook geen thumb hoef aan te maken maar gelijk uit mijn map met image's uitleest.
Nadat ik dit dus veranderd heb leest hij wel de map uit met image, maar op waare grote, ik heb al een tijdje geprobeerd om er high en with er achter te zetten maar kom er niet meer uit.
wie weet hoe ik dus de foto's die hij uitleest uit de map .$directory.$file verkleind kan weergeven?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<?php
function createLbFromDir ($linkname, $galname, $directory, $thumbdirectory, $extensions = array ('jpg', 'jpeg')) {
$gallery = "";
$dh = opendir ($directory);
while ($file = readdir ($dh)) {
$parts = explode(".", basename ($file));
$extension = $parts[count($parts)-1];
if (!is_dir ($directory . $file) && ($file != ".." && $file != ".") && in_array($extension, $extensions)) {
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\" alt=\"\"></a>\n";
}
}
return $gallery;
}
?>
<!--
Here the webpage begins
--!>
<html>
<head>
<!-- Lightbox-Stylesheet --!>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<!-- Lightbox-Javascripts --!>
<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/combo.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<body>
</body>
<div id="content">
<p>Ajaxpride Fotopage</p>
<p>
<!-- Here the PHP-script is called: Options are: linkname, galleryname, path/to/imagegallery/ , path/to/thumbs/
Imagenames in thumbs and imagegallery-folder need to be the same! --!>
<?php echo createLbFromDir ("Linkname", "galleryname", "imagefolder/", "thumbfolder/" ); ?>
[code/]
Gewijzigd op 01/01/1970 01:00:00 door Debrouwer
Dan moet je eens hier kijken, daarmee kun je de grote ophalen en bekijken welke maat het meeste verkleind moet worden zodat je kiest tussen de width en height welke er bij moet staan (in de img tag)
ja ik wil de grote afbeeldingen verkleinen, alleen nu bekijk ik jou link even. maar word wel steeds lastiger gemaakt voor me ik begrijp er weer niks van.
ik ga wel ff kijken wat en waar ik bepaalde code moet gaan plaatsen om ze te verkleinen.
Als iemand nog een iedee heeft ? hou ik me aanbevolen.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?
// Bereken de schaal factoren
$scaleWidthFactor = 100 / $iImageWidth;
$scaleHeightFactor = 100 / $iImageHeight;
// Nu neem je de kleinste verklein factor, elke zijde moet immers binnen de 100 passen.
$useFactor = $scaleWidthFactor < $scaleHeightFactor ? $scaleWidthFactor : $scaleHeightFactor;
$iNewHeight = $iImageWidth * $useFactor;
$iNewWidth = $iImageHeight * $useFactor;
// Nu heb je de nieuwe afmetingen. Je foto heeft nog steeds de juiste verhoudingen.
?>
// Bereken de schaal factoren
$scaleWidthFactor = 100 / $iImageWidth;
$scaleHeightFactor = 100 / $iImageHeight;
// Nu neem je de kleinste verklein factor, elke zijde moet immers binnen de 100 passen.
$useFactor = $scaleWidthFactor < $scaleHeightFactor ? $scaleWidthFactor : $scaleHeightFactor;
$iNewHeight = $iImageWidth * $useFactor;
$iNewWidth = $iImageHeight * $useFactor;
// Nu heb je de nieuwe afmetingen. Je foto heeft nog steeds de juiste verhoudingen.
?>
Gewijzigd op 01/01/1970 01:00:00 door debrouwer
Overigens lees ik nu dat je de basis van html nog niet helemaal onder de knie hebt. Om de hoogte of breedte van een image in te stellen, moet je aan het img element het width of height attribuut toevoegen. Wanneer je één van de twee invuld, zal deze automatisch in proporties gedownscaled worden.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php
function createLbFromDir ($linkname, $galname, $directory, $thumbdirectory, $extensions = array ('jpg', 'jpeg')) {
$gallery = "";
$dh = opendir ($directory);
while ($file = readdir ($dh)) {
$parts = explode(".", basename ($file));
$extension = $parts[count($parts)-1];
if (!is_dir ($directory . $file) && ($file != ".." && $file != ".") && in_array($extension, $extensions)) {
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\" alt=\"\" height="100"></a>\n";
}
}
return $gallery;
}
?>
<!--
Here the webpage begins
--!>
<html>
<head>
<!-- Lightbox-Stylesheet --!>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<!-- Lightbox-Javascripts --!>
<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/combo.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<body>
</body>
<div id="content">
<p>Ajaxpride Fotopage</p>
<p>
<!-- Here the PHP-script is called: Options are: linkname, galleryname, path/to/imagegallery/ , path/to/thumbs/
Imagenames in thumbs and imagegallery-folder need to be the same! --!>
<?php echo createLbFromDir ("Linkname", "galleryname", "imagefolder/", "thumbfolder/" );
?>
function createLbFromDir ($linkname, $galname, $directory, $thumbdirectory, $extensions = array ('jpg', 'jpeg')) {
$gallery = "";
$dh = opendir ($directory);
while ($file = readdir ($dh)) {
$parts = explode(".", basename ($file));
$extension = $parts[count($parts)-1];
if (!is_dir ($directory . $file) && ($file != ".." && $file != ".") && in_array($extension, $extensions)) {
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\" alt=\"\" height="100"></a>\n";
}
}
return $gallery;
}
?>
<!--
Here the webpage begins
--!>
<html>
<head>
<!-- Lightbox-Stylesheet --!>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<!-- Lightbox-Javascripts --!>
<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/combo.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<body>
</body>
<div id="content">
<p>Ajaxpride Fotopage</p>
<p>
<!-- Here the PHP-script is called: Options are: linkname, galleryname, path/to/imagegallery/ , path/to/thumbs/
Imagenames in thumbs and imagegallery-folder need to be the same! --!>
<?php echo createLbFromDir ("Linkname", "galleryname", "imagefolder/", "thumbfolder/" );
?>
storeman schreef op 07.08.2007 21:36:
Om de hoogte of breedte van een image in te stellen, moet je aan het img element het width of height attribuut toevoegen. Wanneer je één van de twee invuld, zal deze automatisch in proporties gedownscaled worden.
Dat laat je toch hopelijk niet aan de browser over?
Jan Koehoorn schreef op 07.08.2007 21:40:
Dat laat je toch hopelijk niet aan de browser over?
Dat zou ik persoonlijk niet op die manier doen. Maar de manier waarop ik de TS interpeteer, moet het hier wel op neerkomen volgens mij. Op die manier heb je de foto's wel alvast gepreload :)
storeman schreef op 07.08.2007 21:36:
Letwel, ik heb mijn code niet op jouw code geschreven. Ik heb de theorie laten zien. Nu moet je het toepassen op je eigen probleem.
Overigens lees ik nu dat je de basis van html nog niet helemaal onder de knie hebt. Om de hoogte of breedte van een image in te stellen, moet je aan het img element het width of height attribuut toevoegen. Wanneer je één van de twee invuld, zal deze automatisch in proporties gedownscaled worden.
Overigens lees ik nu dat je de basis van html nog niet helemaal onder de knie hebt. Om de hoogte of breedte van een image in te stellen, moet je aan het img element het width of height attribuut toevoegen. Wanneer je één van de twee invuld, zal deze automatisch in proporties gedownscaled worden.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php
function createLbFromDir ($linkname, $galname, $directory, $thumbdirectory, $extensions = array ('jpg', 'jpeg')) {
$gallery = "";
$dh = opendir ($directory);
while ($file = readdir ($dh)) {
$parts = explode(".", basename ($file));
$extension = $parts[count($parts)-1];
if (!is_dir ($directory . $file) && ($file != ".." && $file != ".") && in_array($extension, $extensions)) {
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\" alt=\"\" height="100"></a>\n";
}
}
return $gallery;
}
?>
<!--
Here the webpage begins
--!>
<html>
<head>
<!-- Lightbox-Stylesheet --!>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<!-- Lightbox-Javascripts --!>
<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/combo.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<body>
</body>
<div id="content">
<p>Ajaxpride Fotopage</p>
<p>
<!-- Here the PHP-script is called: Options are: linkname, galleryname, path/to/imagegallery/ , path/to/thumbs/
Imagenames in thumbs and imagegallery-folder need to be the same! --!>
<?php echo createLbFromDir ("Linkname", "galleryname", "imagefolder/", "thumbfolder/" );
?>
function createLbFromDir ($linkname, $galname, $directory, $thumbdirectory, $extensions = array ('jpg', 'jpeg')) {
$gallery = "";
$dh = opendir ($directory);
while ($file = readdir ($dh)) {
$parts = explode(".", basename ($file));
$extension = $parts[count($parts)-1];
if (!is_dir ($directory . $file) && ($file != ".." && $file != ".") && in_array($extension, $extensions)) {
$gallery.= "<a href=\"".$directory.$file."\" rel=\"lightbox[".$galname."]\"><img src=\"".$directory.$file."\" alt=\"\" height="100"></a>\n";
}
}
return $gallery;
}
?>
<!--
Here the webpage begins
--!>
<html>
<head>
<!-- Lightbox-Stylesheet --!>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<!-- Lightbox-Javascripts --!>
<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/combo.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</head>
<body>
</body>
<div id="content">
<p>Ajaxpride Fotopage</p>
<p>
<!-- Here the PHP-script is called: Options are: linkname, galleryname, path/to/imagegallery/ , path/to/thumbs/
Imagenames in thumbs and imagegallery-folder need to be the same! --!>
<?php echo createLbFromDir ("Linkname", "galleryname", "imagefolder/", "thumbfolder/" );
?>
ja dat dacht ik ook, hoe jij hier de code geplaatst hebt, had ik ook al geprobeerd en werkt helaas niet. krijg een blanco pagina.
Dat zou toch echt moeten werken. Als je een blanco pagina ziet, zou ik error_reporting even op E_ALL zetten.
ik zag het even niet meer zitten maar het is gelukt.
nu kan ik weer verder met mijn website.
en met mijn volgende probleem mijn poll hahaha.
thanx.
Heb je de reactie van Jan Koehoorn ook gelezen? Het grote voordeel van Thumbs is dat ze maar een paar kb zijn per stuk. Even een rekenvoorbeeldje ivm dataverkeer.
Stel jij hebt nu 20 pagina's met op iedere 20 afbeeldingen op ware grootte (in kb, maar verkleind in de browser). Zeg dat ze zo'n 500kb zijn, das nog weinig voor een digitale fotoop originele grootte, mijn camera is nog maar 3 MegaPixel en een afbeelding is gemiddeld nog net iets groter (maar 500kb rekent wel gemakkelijk).
Een bezoeker loopt al die 20 pagina's door, om een foto te vinden die blijkbaar (wist de bezoeker niet) op de laatste pagina staat. Je stuurt dan 20*20*0,5MB is al (400 foto's van die halve Mb) 200Mb aan data naar die 1e bezoeker. En dat op 1 dag. Wat nu als je veel bezoekers per dag hebt die foto's bekijken, en je hebt maar een bepaalde hoeveelheid data die je per maand vanaf je site kan versturen. Dan kom je na 31 dagen met 1 unieke bezoeker/ nieuwe bezoeker per dag die de foto's bekijkt al op 6200Mb aan dataverkeer. Dit is nogal veel. Bezoekers zullen vaak eerst een thumbnail bekijken, en als die mooi is of als het lijkt op wat ze zoeken, dan openen ze hem.
Gewijzigd op 01/01/1970 01:00:00 door Mebus Hackintosh
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
list($width, $height, $type, $attr) = getimagesize($line['auction_afbeelding']) ;
if ($width <= 300 && $height <= 300){
}elseif($width > $height) {
$shrink = 300/$width;
$width = 300;
$height = $height*$shrink;
} else {
$shrink = 300/$height;
$height = 300;
$width = $width*$shrink;
}
$image = "<center><img src='".$line['auction_afbeelding']."' border='0' STYLE=\"width: ".$width."px; height: ".$height."px; ".$style."\"></center><br><br>";
echo $image;
?>
list($width, $height, $type, $attr) = getimagesize($line['auction_afbeelding']) ;
if ($width <= 300 && $height <= 300){
}elseif($width > $height) {
$shrink = 300/$width;
$width = 300;
$height = $height*$shrink;
} else {
$shrink = 300/$height;
$height = 300;
$width = $width*$shrink;
}
$image = "<center><img src='".$line['auction_afbeelding']."' border='0' STYLE=\"width: ".$width."px; height: ".$height."px; ".$style."\"></center><br><br>";
echo $image;
?>