Hallo zusammen,
gibt es Tipps für und wider einer Schriftskalierung in Abhängigkeit des Browserfensters?
Meines Wissen nur in Flash möglich oder durch eine PHP-CSS-Kombination möglich - für Tipps bin ich dankbar.
Druckbare Version
Hallo zusammen,
gibt es Tipps für und wider einer Schriftskalierung in Abhängigkeit des Browserfensters?
Meines Wissen nur in Flash möglich oder durch eine PHP-CSS-Kombination möglich - für Tipps bin ich dankbar.
du kannst bei font-size doch mit %- oder em- Angaben arbeiten?
Hallo David,
ja das kann ich. Die Vergrößerung findet aber nicht durch die Größenänderung des Browserfensters statt, sondern nur dann, wenn ein Benutzer die Ansicht ändert (oder mit STRG+ (Apfel+) die Seite vergrößert.
Die gewünschte Anforderung ist eine Skalierung des gesamten Inhalts auf die jeweilige Browsergröße :rolleyes:.
ahh!
du meinst eine skalierung onresize... :o
das schreit verdächtig nach nem jscript.
In Programmiererworten zusammengefasst: ja exakt so ;)
Also such ich nach Javascripts...
Wenn Du einen Tipp hast: gerne :)
als freudiger javascripter habe ich mich eben mal dran gemacht...:cool:Zitat:
Zitat von planepix
:) Danke. Bin gespannt ob sich das realisieren lässt ;)
Hallo,
irgendwann mal hatte ich auch so etwas vor - ich hätte es mit JavaScript gelöst. Mein damaliger Stand:
Vielleicht lässt sich darauf ja was aufbauen. Wie gesagt - wurde damals nicht fertig entwickelt.Code:<script type="text/javascript">
var normal_size = 13;
var min_size = 10;
window.addEvent('domready', function(){
$('top').setStyle('font-size',''+normal_size+'px');
});
window.addEvent('resize', function(){
if(!window.innerWidth)
{
//strict mode
if(!(document.documentElement.clientWidth == 0))
{
height = document.documentElement.clientHeight;
}
//quirks mode
else
{
height = document.body.clientHeight;
}
}
//w3c
else
{
height = window.innerHeight;
}
var new_size = height/40;
if(min_size <= new_size){$('top').setStyle('font-size',''+new_size+'px');}
else{$('top').setStyle('font-size',''+min_size+'px');}
});
</script>
Gruß Janosch
hab eben mal folgendes zusammengestellt:
Allerdings wurden da noch nich alle browser getestet, läuft zumindest auf safari mac (damit vermutl. auch auf ff)HTML-Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
html, body {
height: 100%;
}
body {
line-height: 500px;
font-size: 500px;
}
</style>
</head>
<body>
<script type="text/javascript" charset="utf-8">
var factor = 100;
var bodyEement = document.getElementsByTagName('body')[0];
var getHeight = function() {
return document.body && document.body.clientHeight ? document.body.clientHeight : window.innerHeight;
}
var resize = function() {
var result = (getHeight() * factor / 100) + 'px';
bodyEement.innerHTML = result;
bodyEement.style.fontSize = result;
bodyEement.style.lineHeight = result;
}
window.onresize = resize;
resize();
</script>
</body>
</html>