egyetem:webc2:html5api:f3:forrasanyag
| Tantárgy: | Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] |
| Tananyag: | HTML5 - Új API-k |
| Feladat: | Négyzet választás |
Megoldás forráskódja
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Négyzet választás</title>
<meta name="author" content="Tóth Péter" />
<meta name="copyright" content="© 2012, NYME SEK" />
<meta http-equiv="date" content="2012-10-12" />
<meta name="revised" content="Tóth Péter, 12/10/2012" />
<meta name="description" content="HTML - Új API-k - Négyzet választás" />
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style type="text/css">
#idBox1,#idBox2,#idBox3{
width:100px;
height:100px;
background-color:blue;
margin:0px 50px 0px 0px;
display:inline-block;
border:0;
padding:0;
outline:0;
}
</style>
<script type="text/javascript">
<!--
// OnLoad függvény
function funcStart(){
// Lekérdezzük a folyamat elején a kijelölt elem értéket
var iIdx=new Number(localStorage.getItem("box"));
// Ellenőrizzük, hogy volt-e megfelelő értéke az oldal frissítése előtt a változóban
if((iIdx>=1)&&(iIdx<=3)){
// Beállítjuk a megfelelő színt
document.getElementById("idBox"+iIdx).style.backgroundColor="red";
}
}
// OnClick lekezelése
// idx - Megmutatja, hogy melyik index-ű négyzet volt lenyomva
function funcKlick(idx){
// Elmentjük háttér adatba a kijelölt téglalap azonosítóját
localStorage.setItem("box",idx);
// Újratöltjük a weboldalt;
location.reload();
}
-->
</script>
</head>
<body onload="funcStart()">
<div id="idBox1" onclick="javascript:funcKlick(1);"></div>
<div id="idBox2" onclick="javascript:funcKlick(2);"></div>
<div id="idBox3" onclick="javascript:funcKlick(3);"></div>
</body>
</html>
egyetem/webc2/html5api/f3/forrasanyag.txt · legutóbbi módosítás: (külső szerkesztés)
