Dieses Skript überprüft alle Elemente mit der Klasse .fixMinMaxwidth und beobachtet das Fenster. Es wird nur auf Browser angewendet, die keine native Unterstützung für min/max-width haben, wie z. B. IE6 und älter. Auch Fenstergrößenänderungen sind kein Problem.
<script type="text/javascript">
//anonymous function to check all elements with class .fixMinMaxwidth
var fixMinMaxwidth=function()
{
//only apply this fix to browsers without native support
if (typeof document.body.style.maxHeight !== "undefined" &&
typeof document.body.style.minHeight !== "undefined") return false;
//loop through all elements
$('.fixMinMaxwidth').each(function()
{
//get max and minwidth via jquery
var maxWidth = parseInt($(this).css("max-width"));
var minWidth = parseInt($(this).css("min-width"));
//if min-/maxwidth is set, apply the script
if (maxWidth>0 && $(this).width()>maxWidth) {
$(this).width(maxWidth);
} else if (minWidth>0 && $(this).width()<minWidth) {
$(this).width(minWidth);
}
});
}
//initialize on domready
$(document).ready(function()
{
fixMinMaxwidth();
});
//check after every resize
$(window).bind("resize", function()
{
fixMinMaxwidth();
});
</script>
hmm... wenn ich versuche, das zu implementieren, kann IE6 die Werte für maxWidth und minWidth nicht parsen. Moderne Browser können sie korrekt interpretieren. Konntest du das erfolgreich nutzen?
Ich habe es herausgefunden. Ich verwende einen globalen Stil von max-width: 100% für alle Bilder. Da IE6 diesen Prozentsatz relativ zur Bildgröße und nicht zum Elternelement berechnet, schlug der Effekt fehl. Ich habe maxWidth auf die Breite des Elternelements jedes Bildes gesetzt anstatt auf die expliziten 100% aus dem CSS, und das scheint den Trick zu tun. Ich bin mir nicht ganz sicher, was ich für min-width tun soll. Alternativ würde ein Satz von IE6-spezifischen CSS, das sich auf alle möglichen max-Breiten bezieht, mit dem bestehenden Code funktionieren, wäre aber schnell unübersichtlich.
Ich denke, dies ist eine elegantere Lösung für die gleiche Idee, und sie funktioniert rückwärts, einschließlich IE6. Sie ist für Vollbild-Flash mit Mindestmaßen konzipiert, aber das Konzept könnte auch ohne Flash angewendet werden. (obwohl sie nicht für Höchstmaße, sondern nur für Mindestmaße konzipiert ist)