Poniżej wprowadziłem kod (Java Script) kalkulatora. Kod zawiera funkcje w oddzielnym pliku oraz formatowanie css. Plik Java script (dla Michała na zielono)<html>
<head>
<meta charset="UTF-8">
<link href="kalk1.css" type="text/css" rel="stylesheet">
</head>
<body>
<script type="text/javascript"SRC = "kalk1.js">
document.write("Nie można otworzyć pliku ze skryptem.")
</SCRIPT>
<form>
<legend>ADAM'S CODE SCHOOL</legend>
<div id="tlo" cellpadding=14>
<div class="po"><input class="kalk" id="okno" style="background-color:black;" "type="text">
<input class="p1" type="button" value=ON style="width: 100px; height: 45px" onclick="wlacz(this.value);"></div><br>
<div class="po">
<input class="p1" type="button" value=1 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value=2 style="width: 150px; height: 45px"onclick="czytaj(this.value);">
<input class="p1" type="button" value=3 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='/' style="width: 150px; height: 45px" onclick="czytaj(this.value);">
</div>
<div class="po">
<input class="p1" type="button" value=4 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value=5 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value=6 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='*' style="width: 150px; height: 45px" onclick="czytaj(this.value);"></div>
<div class="po"><input class="p1" type="button" value=7 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value=8 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value=9 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='-' style="width: 150px; height: 45px" onclick="czytaj(this.value);"></div>
<div class="po"><input class="p1" type="button" value=0 style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='.' style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='C' style="width: 150px; height: 45px" onclick="czytaj(this.value);">
<input class="p1" type="button" value='+' style="width: 150px; height: 45px" onclick="czytaj(this.value);"></div>
<div class="po"><input class="px" type="button" value='=' style="width: 61%; height: 45px"onclick="oblicz(document.getElementById('okno').value);"></div>
</div>
</form>
</body>
</html>
------------------------------------------------------ teraz plik z kodem javy o nazwie kalk1.js ---------------------------------------------------------------
var x=1;
document.getElementById('okno').style.backgroundColor="black";
document.getElementById('okno').value = '';
function wlacz(przycisk){++x; x%=2;
if(x==0){document.getElementById('okno').style.backgroundColor="yellow";
document.getElementById('button').value="ON";}
else{document.getElementById('okno').style.backgroundColor="black";
document.getElementById('button').value="OFF";};
}
function czytaj(przycisk) {
if (przycisk == 'C') {
document.getElementById('okno').value = '';
}
else {
document.getElementById('okno').value += przycisk;
}
}
function oblicz(wartosc) {
var wynik = eval(wartosc);
document.getElementById('okno').value = wynik;
}
---------------------------------------- A teraz wklejam plik css o nazwie kalk1.css-----------------------------------------------------------------
.kalk {
width: 500px;
height:40px;
margin: 10px;
#tlo{
width: 600px;
height:800px;
background: #CCFFCC;
padding: 0px;
border:0px solid #000;
}
.po{
width:900px;
height:100px;
float:left;
right:10px;
bottom:250px;
background:coral;
}
.p1{
font: 8pt Arial; font-style: italic;
font-weight: bold; color:blue; background:coral;
width:100px;
height:100px;
}
.px{
width:450px;
height:50px;
float:right;
right:10px;
bottom:250px;
}
