Mit folgendem Template und einem gemischten
bestimme ich Breite und Höhe von Bildern.
Vielleicht kann es jemand brauchen.
Viel Spass!
horstees
Es existiert zu diesem Template eine DB mit u.a.folgenden Feldern:
bild
breite
hoehe
name
motiv
usw.
Beim Aufruf diese Templates werden, nachdem die Bilder vollständig geladen wurden, mit Javascript deren Breite und deren Höhe bestimmt, dann in Eingabefelder geschrieben und anschliessend
mit perl in die Datenbank geschrieben.
Das Template wird automatisch geschlossen, in der DB sind jetzt alle Angaben exakt eingetragen.
Je nach Grösse der DB und der Größe der Bilder dauert das ein paar Sekündchen...
Von dort kann man die Werte dann in anderen Templates über den Zugriff auf die Felder auslesen und als Variable im img - tag einsetzen <img width=$breite heigth=$hoehe usw.. Es wäre dann z.B. auch möglich Bilder nur in 50% ihrer Originalgrösse zu zeigen oder sie auf eine Maximalbreite zu begrenzen. Allerdings ist zu beachten,
daß die Größe der Bilddatei und damit die Ladezeit im Browser nicht verändert, d.h. verkleinert wird.
Denkbar sind jetzt z.B. Text- oder Tabellenformatierungen in Abhängigkeit von der Bildgroesse, etwa:
- wenn Bildbreite groesser 200, dann rechts keine Textanzeige
- wenn Bildbreite kleiner 200, dann Textanzeige rechts
oder ähnliches.
Viel Spass!
-->
<html>
<head>
<title>Bildgrösse bestimmen</title>
<style type="text/css">
td.boden
font-family:verdana,arial;
font-size:8pt;
border-bottom-style:solid;
border-bottom-width:1px;
border-bottom-color:eeeeee;
</style>
</head>
<body text=000000 onLoad=groesse_bestimmen()><!-- Die Funktion steht weiter unten in der while(get_next.... um die Werte von $_loop aufzunehmen-->
<perl>
get "bild sort=bild","alleschoenenbilder","auswahl";
out <<prae_schleife;
<table style=border-style:solid;border-width:1px;border-color:efefef; cellpadding=4 cellspacing=0 width=100%>
<form name=album action='http://horstees.de/baseportal/grafik/alleschoenenbilder?htx=/horstees.de/baseportal/grafik/alleschoenenbilder&gesendet=ja' method='post'
enctype='multipart/form-data'> <!--übergibt mit gesendet=ja Info, ob das Formular bereits gesendet wurde-->
prae_schleife
while(get_next(auswahl))
{
$eingabe_breite="b_".$_loop; # für 'name=' im <input>
$eingabe_hoehe="h_".$_loop;
if($gesendet ne ja)
{$submit_string="document.album.Sendeknopf.click();"}
# startet den Submit button automatisch
# Will man das Template ausgiebig betrachten, muss man die beiden obigen zeilen
# auskommentieren. Ansonsten wird es nur kurz geladen,abgesendet, und direkt
# wieder geschlossen.
out <<schleife;
<tr>
<td class=boden><img src="http://www.horstees.de/files/$bild" align=middle></td>
<td class=boden style=text-align:right;padding-right:10px;>
$bild (</td>
<td class=boden><input style=border-style:solid;border-width:1px;border-color:efefef; type='text' name="$eingabe_breite=" size="3" align=middle> x </td>
<td class=boden><input style=border-style:solid;border-width:1px;border-color:efefef; type='text' name="$eingabe_hoehe=" size="3" align=middle> px )
</td></tr>
<script type="text/javascript">
<!--
function groesse_bestimmen()
for(zaehler=0;zaehler<=$_loop;zaehler++)
Weite = document.images[zaehler].width; /* Groesse bestimmen */
Hoehe = document.images[zaehler].height;
breiten = zaehler*2;
hoehen = zaehler*2+1;
document.forms[0].elements[breiten].value = Weite; /* Groesse in Formularelement Eingabefeld schreiben */
document.forms[0].elements[hoehen].value = Hoehe;
}
$submit_string; /* startet den submit-Button, Def am Anfang der while */
}
// -->
schleife
if($gesendet eq ja) # Erst nach dem Senden werden die Datensätze modifiziert
{
mod "Id==$_id",["breite",$$eingabe_breite,"hoehe",$$eingabe_hoehe,"name",$bild],"alleschoenenbilder";
}
# Hier natürlich die Feldnamen durch eigene ersetzen...
}
out <<ende;
<tr>
<td class=boden colspan=4 align=center height=80px>
<input name="Sendeknopf" value='Werte in Datenbank übertragen' type=submit style=border-style:solid;border-width:1px;border-color:efefef; onMouseOver=this.style.backgroundColor='#df0000',this.style.color='rgb(255,255,255)' onMouseOut=this.style.backgroundColor='#ffffff',this.style.color='#000000'></td></tr>
<tr>
<td class=boden colspan=4 align=center height=80px><input type='hidden' name='htx=' value='$_db'>
</form>
ende
if($gesendet eq ja){out "<script language='JavaScript'> window.close();</script>"}
# Fenster wird geschlossen; # diese Zeilen lassen, wenn man sich die Bilder noch mal anschauen will
