Spalten höhe und breite auslesen.
Gorduan
- javascript
0 Gorduan
Hallo zusammen,
ich habe das Problem das ich auf einer Webseite ein Bilde auf die Größe der Spalte anpassen will. Nun ist in der Spalte aber mehr Inhalt als nur das Bild und die Webseite soll unter keinen Umständen einen Scrollbalken enthalten. Das Bild wird durch eine PHP Galerie gesetzt und ist daher mal senkrecht(daher höher als breit) mal horizontal(daher breiter als hoch).
Ich will also die Spaltenbreite und -höhe, die Bildbreite und -höhe auslesen und durch eine Formel entscheiden ob ich "height" oder "Widht" des Bildes auf ein Wert fixe.
Nun ist das Problem da das ich nichts finden kann, was in Javascript Spaltenbreiten auslesen kann, wenn sie nicht definiert sind(die Spalte ist 100%hoch und breit). Dann hatte ich noch die Idee eine zusätzliche Zeile und Spalte mit einmal der breite 1 und ein mal der Höhe 1 mit einem transparenten Bild 1x1pixel gestreckt mit 100%. Das ganze sieht dann so aus:
<table width="100%" >
<tr>
<td width="100" height="110"></td>
<td width="185" valign="top">
<div id="websitetitle">
<h1 style="color: #797979; font-size: 24px;">Mareike Lauken</h1>
<h2 style="font-size: 18px; font-weight: bold;">Photography</h2>
</div>
</td>
<td valign="top"></td>
<td></td>
</tr>
<tr>
<td valign="top"></td>
<td valign="top">
<div id="sidebar">
<jdoc:include type="modules" name="left" style="xhtml" />
</div>
</td>
<td valign="top">
<div id="content">
<jdoc:include type="message" />
<jdoc:include type="modules" name="debug" />
<jdoc:include type="component" />
</div>
</td>
<td width="1"><img src="images/contentsizehelper.png" border="0" width="1" height="100%"></td>
</tr>
<tr>
<td></td>
<td></td>
<td height="1"><img src="images/contentsizehelper.png" border="0" width="100%" height="1"></td>
<td></td>
</tr>
</table>
Nur finde ich genauso wenig eine Möglichkeit die gestreckte Länge und Breite dieser Bilder auszulesen, also wieder das selbe Problem. Habe ich da einen Falschen Denkansatz oder gibt es dafür gar keine Möglichkeit? Mit PHP geht es ja auch nicht da es ein serverseitiges Script ist, also muss es doch irgendwie mit Javascript gehen oder kann ich den versuch direkt in die Tonne kloppen. In Javascript bin ich leider etwas eingerostet.
P.S siehe URL.
MFG Gorduan
<td valign="top">
<div id="content">
<jdoc:include type="message" />
<jdoc:include type="modules" name="debug" />
<jdoc:include type="component" />
</div>
</td>
Ich habe vergessen das Bild durch "<jdoc:include type="component" />" Eingefügt wird.
Bild ohne restlichen Content:
`<img src="/mareike/index.php/gallery/image?view=image&format=raw&type=img&id=5" class="jg_photo" id="jg_photo_big" height="320" alt="Test02_4" onmouseover="javascript:joom_hover();" onmouseout="javascript:joom_hover();" />`{:.language-html}
monentan auf "height=320" gefixt aber bei den meisten Bildschirmen zuklein.
MFG Gorduan