Kattintható DIV

A minap belefutottam egy egyszerű problémába: kattintható kell tenni egy DIV teljes területét. A megoldás egyszerű, remélem lesz akinek megspórolok vele - ha mást nem - pár percet. A DIV-re egy onclick eseményt kell rakni az alábbi módon:

<div id="doboz1" onmouseover="this.style.cursor='pointer';" onclick="window.location.href='http://www.tutorial.hu'">
	Ez itt egy 200x150px-es div belső tartalma
</div>

az id="doboz1"-hez tartozó CSS jelen esetben ennyi:

	#doboz1 {
		width: 200px;
		height: 150px;
		border: 1px solid black;
		background-color: #CCCCCC;
		}

Ennek eredményeképpen kapunk egy szürke alapterületű, fekete keretes DIV-et benne némi szöveggel és az egész DIV területe kattintható lesz. A kattinthatóságért a már említett onclick rész felel, az onmouseover="this.style.cursor='pointer';" pedig azért, hogy a kattintható terület fölé vitt egérmutató átváltson kézre. Ezt persze a későbbiekben lehet még cifrázni, pl. az alábbi kód az egérmutató DIV fölé vitelére a DIV háttérszínét fogja megváltoztatni zöldre:

<div onmouseover="this.style.backgroundColor='#B2DB11'; this.style.cursor='pointer';" onclick="window.location.href='http://www.tutorial.hu'" onmouseout="this.style.backgroundColor='#FFFFFF'">
	E tartalom körülötti DIV is kattintható és még a színét is változtatja
</div>

kattinthatodiv.html mintaDzsoco egy apróbb kiegészítést írt a Fórumba, köszönjük neki! - BlackY