Zmiana rozmiaru czcionki fontSize

0

Witam, znalazłem kod który pobiera i zmienia rozmiar czcionki:

function test(size)
{
	var allTags=document.getElementsByTagName('*'), i=0, e;
			
	var size = parseInt(size,10);			
			
	while(e=allTags[i++])
	{
			
		if(e.id)
		{
			var el = document.getElementById(e.id);
			var curFont = parseInt(el.style.fontSize,10);
			el.style.fontSize = (size) + 'px';
		}
	}
}

Pierwsze pytanie dotyczy elementów dla których parametr id nie został zdefiniowany

document.getElementsByTagName('*')

<div class="header">...</div>
<div class="body" id="_">...</div>
<div class="fotter" id="_" style="font-size:12px;">...</div>

Polecenie pobiera wszystkie obiekty dla których id jest zdefiniowane, a jak pobrać te które tego nie mają?
Dalej, dla klasa "body" rozmiar czcionki zdefiniowany jest w CSS, a niestety pobierana wartość to 'NaN', jak rozwiązać dwa powyższe problemy?

0

zara zara, przecież e jest elementem - po co wyciągasz z niego id, pobierasz jeszcze raz ten sam element po id, i dopiero robisz jakieś akcje?

podaj kod js jak pobierasz rozmiar czcionki z drugiego pytania

0

Żeczywiście tyle wystarczy do pobrania samych div'ów

var allTags=document.getElementsByTagName('div'), i=0, e;

A jak pobrać rozmiar czcionki?

var curFont = parseInt(el.style.fontSize,10);
0

Musiałem sobie trochę odświeżyć wiedzę na temat javaScript, ale udało się... efekt końcowy poniżej...
Chciałem jeszcze zapytać o opcję symulacji wciśnięcia klawisza Ctrl + +, czy z poziomu JS mogę coś takiego wykonać?
Lub wykorzystać API przeglądarki chociaż z tym może być różnie...

<script type="text/javascript">
	var iOldChangeSize = 0;

	function changeFontSize(size)
	{
		var allTags=document.getElementsByTagName('div'), i=0, e;

		var iChangeSize = 0;

		switch(size)
		{
			case 1:
				iChangeSize = 2;
				break;
			case 2:
				iChangeSize = 4;
				break;
			case 3:
				iChangeSize = 8;
				break;
		}

		switch(iOldChangeSize)
		{
			case 1:
				iChangeSize += -2;
				break;
			case 2:
				iChangeSize += -4;
				break;
			case 3:
				iChangeSize += -8;
				break;
		}

		iOldChangeSize = size;
		
		while(e=allTags[i++])
		{
				var style = window.getComputedStyle(e, null).getPropertyValue("font-size");
				var fontSize = style.substring(0, style.indexOf('px'));
				
				e.style.setProperty("font-size", parseInt(fontSize, 10) + parseInt(iChangeSize, 10) + "px", null);
		}
		
	} 
</script>
0

Istnieje sposób, by z pomocą JS-a (i -- nawet bardziej -- CSS-a) zasymulować to, co się dzieje normalnie po wciśnięciu [CTRL]-[+]. Czyli zoomowanie strony. Sposób jest oparty na standardach i działa w każdej przeglądarce, ale jest trudny w wykonaniu.

Musisz WSZYSTKIE rozmiary na stronie zdefiniować używając jednostki em. Nie pikseli, tylko emów. Będziesz miał trochę kalkulacji. Zwykle robi się tak, że na elemencie html ustawiasz font-size na 62.5%, co się równa 10 pikselom. Na body robisz font-size: 1.0em. Potem, gdy chcesz, by pasek boczny miał np. normalnie 200px szerokości, definiujesz jego szerokość jako 20em. Rozmiary czcionek też podajesz w emach, ale rób to oszczędnie: jeśli przedefiniujesz rozmiar czcionki w jakimś elemencie np. na 1.2em, to we wszystkich elementach potomnych 1em będzie równy już nie 10 pikselom, tylko 12.

W każdym razie, potem w JavaScripcie wystarczy tylko zmienić rozmiar czcionki na body. Zmień z 1.0em na 2.0em, i już wszystko się robi 2x większe, bo rozmiary wszystkiego podawałeś w emach. A one są jednostkami (mocno) relatywnymi. 1em to jest "tyle, ile wynosi font-size w aktualnym elemencie". Zmieniając font-size na body, zmieniasz bezwzględną wartość font-size w pozostałych elementach, a co za tym idzie również wymiary tych elementów.

To technika zaawansowana i niezbyt przydatna. Podałem ją jako ciekawostkę. Ja sam zastosowałem ją na 1 lub 2 stronach, ale było to jeszcze za czasów, gdy IE6 było popularne. A IE6 nie pozwalało na skalowanie czcionek podanych w pikselach. Nie wszystkie popularne przeglądarki miały wtedy w ogóle łatwo dostępny zoom i raczej [CTRL]-[+] powiększało czcionkę, a nie robiło zoomu.

1 użytkowników online, w tym zalogowanych: 0, gości: 1