• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

max-width - Alternative

Status
Für weitere Antworten geschlossen.
Verhueterli

Verhueterli

Neues Mitglied
Hallo!

Bei meinem Skript können Admins beim News schreiben Bilder einfügen (nicht hochladen!) und gegebenenfalls verlinken.

Nun, damit große Bilder nicht das ganze Layout und Design zersprengen, habe ich in der entsprechenden Sektion ein max-width und ein max-height eingefügt.

Bei css4you habe ich aber gerade gesehen, dass der Internet Explorer diese beiden CSS-Attribute gar nicht unterstützt und nun suche ich nach Alternativen.

Kennt ihr welche?
 
HAste schon für den IE probiert einfach height und width?

SOllte eigentlich klappen.. hatte auch mal ein ähnliches prob.
 
das script, welches die bilder einfügt sollte sie für diese version einmal runtergerechnet speichern und einmal in originalgröße. das runtergerechnete dann ins layout und beim click drauf gehts zum großen.
 
philipp schrieb:
das script, welches die bilder einfügt sollte sie für diese version einmal runtergerechnet speichern und einmal in originalgröße. das runtergerechnete dann ins layout und beim click drauf gehts zum großen.
Zum Vergrößern anklicken....
Die Bilder werden nicht hochgeladen, sondern verlinkt. (Erster Beitrag...)
 
Falls du php benutzt kannst du mit der funktion getimagesize informationen zu bildern erhalten (laut php manual auch über den URL). Mit hilfe dieser informationen kannst du dem bild von vorneherrein kleinere maße zuweisen.

Mit CSS gibt es keine möglichkeit für den ie max-width/height zu setzten. Es gibt zwar hacks allerdings weiß ich nicht mehr wo ich diese gefunden habe. Ich würde aber von solchen mitteln abraten.
 
maximal könntest du noch mit

<!--[if IE]> und <![endif]--> arbeiten, und in deisen bereichen einen div mit overflow:scroll o.ä. reinmachen, also in etwa so:


HTML: 
<!--[if IE]><div style="width:300px; height:400px; overflow:scroll;"><![endif]-->
<img src="bild.jpg">
<!--[if IE]></div><![endif]-->

allerdings wird dann bei allen ie usern ein div um das bild herum gelegt, und ich weiß nicht, ob dein layout das zulässt, und es funktioniert nur im ie ab version 5.5 :-/

aber vllt. hilft es dir ja ein bisschen weiter :-D

/E: man könnte dann noch js hinzufügen, und dann in den zuvor von mir geposteten code noch ein noscript reinsetzen, damit der div nur dann angezeigt wird, wenn ie-user js deaktiviert haben
also so meine ich das:
HTML: 
<!--[if IE]><noscript><div style="width:300px; height:400px; overflow:scroll;"></noscript><![endif]-->
<img src="bild.jpg">
<!--[if IE]><noscript></div><![endif]--></noscript>
 
Prophet schrieb:
Falls du php benutzt kannst du mit der funktion getimagesize informationen zu bildern erhalten (laut php manual auch über den URL). Mit hilfe dieser informationen kannst du dem bild von vorneherrein kleinere maße zuweisen.

Mit CSS gibt es keine möglichkeit für den ie max-width/height zu setzten. Es gibt zwar hacks allerdings weiß ich nicht mehr wo ich diese gefunden habe. Ich würde aber von solchen mitteln abraten.
Zum Vergrößern anklicken....

Commodore schrieb:
maximal könntest du noch mit

<!--[if IE]> und <![endif]--> arbeiten, und in deisen bereichen einen div mit overflow:scroll o.ä. reinmachen, also in etwa so:


HTML: 
<!--[if IE]><div style="width:300px; height:400px; overflow:scroll;"><![endif]-->
<img src="bild.jpg">
<!--[if IE]></div><![endif]-->

allerdings wird dann bei allen ie usern ein div um das bild herum gelegt, und ich weiß nicht, ob dein layout das zulässt, und es funktioniert nur im ie ab version 5.5 :-/

aber vllt. hilft es dir ja ein bisschen weiter :-D

/E: man könnte dann noch js hinzufügen, und dann in den zuvor von mir geposteten code noch ein noscript reinsetzen, damit der div nur dann angezeigt wird, wenn ie-user js deaktiviert haben
also so meine ich das:
HTML: 
<!--[if IE]><noscript><div style="width:300px; height:400px; overflow:scroll;"></noscript><![endif]-->
<img src="bild.jpg">
<!--[if IE]><noscript></div><![endif]--></noscript>
Zum Vergrößern anklicken....
Beides gute Ideen, ich werde mal versuchen, die beiden Ideen zu kombinieren.

Edit
Leider erlaubt es mir die Server-Konfiguration nicht getimagesize() bei URLs anzuwenden. Insofern werde ich Commodores Vorschlag folgen.

Edit²
Oh je, da bin ich wohl in einen Teufelskreis gelangt. Denn wenn ich um die Bilder ein Div mache mit z.B. der Größe 450x450 und der User fügt ein Bild von 32x16 ein, dann ist um das Bild herum ein riesen Abstand, da das Div ja so groß ist.
 
Zuletzt bearbeitet:
Verhueterli schrieb:
Beides gute Ideen, ich werde mal versuchen, die beiden Ideen zu kombinieren.

Edit
Leider erlaubt es mir die Server-Konfiguration nicht getimagesize() bei URLs anzuwenden. Insofern werde ich Commodores Vorschlag folgen.

Edit²
Oh je, da bin ich wohl in einen Teufelskreis gelangt. Denn wenn ich um die Bilder ein Div mache mit z.B. der Größe 450x450 und der User fügt ein Bild von 32x16 ein, dann ist um das Bild herum ein riesen Abstand, da das Div ja so groß ist.
Zum Vergrößern anklicken....

den sieht der user dann aber nur, wenn er den ie benutzt, und javascript deaktiviert hat.
 
Verhueterli schrieb:
Das habe ich schon verstanden.

Aber was hat JavaScript damit zu tun? Wieso nur, wenn JavaScript deaktiviert ist?
Zum Vergrößern anklicken....

wenn du nach diesem if ie noch einen <noscript>-tag reinpackst, dann sieht man das halt nur dann nicht, wenn js-deaktiviert ist. das hat den zweck, dass du nun eine js-funktion einbauen kannst, welche die größe der bilder verkleinert, wenn sie zu groß sind.

nur musst du so eine funktion erst coden :o

ich emfpehle das in etwa so zu machen:

- zunächst rausfinden, welche der beiden seiten größer ist
- dann das verhältnis der beiden seiten zueinander herausfinden (länge der kürzeren seite / länge der längeren seite)
- dann verkleinerst du die längere seite so weit wie nötig
- die kürzere seite wird ebenfalls verändert, ihre größe entspricht die neue länge der langen seite * länge der kurzen seite

somit sollte das theoretisch klappen.
 
Verhueterli schrieb:
Schön und gut, leider bin ich aber überhaupt nicht mit JavaScript vertraut und habe nur wenige Grundkentnisse.
Zum Vergrößern anklicken....

ok, ich versuch mal, was sich machen lässt, aber heute fang ich nicht mehr an. ich werde morgen etwas posten (warscheinlich als edit um doppelposts zu verweiden)


/E: ok, ich habs doch jetzt gemacht, hab nix besseres zu tun ;-)

HTML: 
<html>
<head><title>Bilder verkleinern</title>
</head>
<body>
<img src="Bild.jpg" >
<img src="Bild2.jpg">
<img src="nochwas.jpg">
<script type="text/javascript">
var bild = new Array();
var maximale_breite = 300; //Grenzwert für die Breite der Bildes.
var maximale_hoehe = 300;  //Grenzwert für die Hoehe der Bidler.
for(a = 0 ; a < document.images.length ; a++){
bild[a] = document.images[a];
var links = bild[a].height;
var unten = bild[a].width;
if(links < unten){
bild[a].width = maximale_hoehe;
} else {
bild[a].height = maximale_breite;
}
}
</script>
</body>
</html>
das script sucht automatisch alle bilder, die in deiner html-datei sind raus, und skaliert die auf eine festgelegt breite/höhe. am besten ist es, wenn du allerdings keine anderen bilder einfügst, da die sonst ebenfalls skaliert werden. wenn du etwas zum style hinzufügen willst, dann am besten per background-image.
 
Zuletzt bearbeitet von einem Moderator:
Vielen Dank..doch leider besteht das ganze Design aus Bildern (Vorgabe, da hab ich nichts mit zu tun), die dummerweise größer sind als die maximalen Werte für die Bilder in News-Einträgen.

Ich schätze, mir bleibt nichts anderes übrig, als darauf zu warten, dass der IE CSS lernt.

Trotzdem danke für die Versuche zu helfen.
 
Verhueterli schrieb:
Vielen Dank..doch leider besteht das ganze Design aus Bildern (Vorgabe, da hab ich nichts mit zu tun), die dummerweise größer sind als die maximalen Werte für die Bilder in News-Einträgen.

Ich schätze, mir bleibt nichts anderes übrig, als darauf zu warten, dass der IE CSS lernt.

Trotzdem danke für die Versuche zu helfen.
Zum Vergrößern anklicken....
doch, eine möglichkeit gibt es noch.

also:

alle bilder der seite werden in der for-schleife in den array "bild" gespeichert. wenn man nun die for-schleife später startet, und sie auf einen bestimmten wert begrenzt (nicht alle bilder, sondern alle bilder minus die bilder, die nach den userbildern auf der page sind) dann werden nicht alle bilder verklerinert. allerdings brauchst du dann einen speziellen wert, der auf deine seite angepasst ist, daher kann ich dir ohne weitere infos wohl kaum helfen. danach rate ich dir allerdings bilder nur noch in einem div mithilfe von background-image einzufügen, da du sonst die variablen verändern müsstest.


also alles was ich wissen müsste, ist:

-wie viele bilder sind vor den bildern der user
-sind irgendwelche bilder zwischen den userildern, die nicht heruntergestuft werden sollen, wenn sie zu groß sind?
- wie viele ilder sind nach den bildern der user?

(alle 3 werte beziehen sich auf die reihenfolge im quelltext)


wenn du mir diese infos gibst, dann kann ich dir weiterhelfen
 
Die sonstigen Bilder der Seite ändern sich immer, da es regelmäßig neue Designs gibt.

Wie gesagt, vielen Dank für eure Mühe.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben