Aby umieścić kalkulatorek na swojej stronie należy:
- przede wszystkim przegrać pliki "kalk.css" i "kalk.js" do katalogu,
który podamy w ramach HEAD swojej strony, w następujący sposób:
<link href="kalk.css" rel=stylesheet content-type="text/css">
<script src="kalk.js"></script>
- następnie w wybranym przez Ciebie miejscu w BODY wstawiamy formularz:
<form name="kalkulacja">
<table class=kalkulator_tlo>
<tr align=center>
<td colspan=4>
<input class=kalkulator_ekran type="text" name="ekran" value="0" maxlength="21"></td>
</tr>
<tr align=center>
<td><input class=kalkulator_cyfry type="button" name="7" value=" 7 " onclick="klawisz(7
,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="8" value=" 8 " onclick="klawisz(8
,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="9" value=" 9 " onclick="klawisz(9
,'')"></td>
<td><input class=kalkulator_operacje type="button" name="/" value=" / "
onclick="klawisz(11,'/')"></td>
</tr>
<tr align=center>
<td><input class=kalkulator_cyfry type="button" name="4" value=" 4 " onclick="klawisz(4,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="5" value=" 5 " onclick="klawisz(5,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="6" value=" 6 " onclick="klawisz(6,'')"></td>
<td><input class=kalkulator_operacje type="button" name="*" value=" * "
onclick="klawisz(11,'*')"></td>
</tr>
<tr align=center>
<td><input class=kalkulator_cyfry type="button" name="1" value=" 1 " onclick="klawisz(1,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="2" value=" 2 " onclick="klawisz(2,'')"></td>
<td><input class=kalkulator_cyfry type="button" name="3" value=" 3 " onclick="klawisz(3,'')"></td>
<td><input class=kalkulator_operacje type="button" name="-" value=" - "
onclick="klawisz(11,'-')"></td>
</tr>
<tr align=center>
<td><input class=kalkulator_cyfry type="button" name="0" value=" 0 " onclick="klawisz(0,'')"></td>
<td><input class=kalkulator_operacje type="button" name="+/-" value="+/- "
onclick="klawisz(11,'+/-')"></td>
<td><input class=kalkulator_operacje type="button" name="." value=" , "
onclick="klawisz(11,'.')"></td>
<td><input class=kalkulator_operacje type="button" name="+" value=" + "
onclick="klawisz(11,'+')"></td>
</tr>
<tr align=center>
<script language="javascript" type="text/javascript"><!--
addShowHideButton("opcje", "Ukryj", "Opcje", false);
//--></script>
<td><input class=kalkulator_operacje type="button" name="C" value=" C "
onclick="klawisz(11,'C')"></td>
<td><input class=kalkulator_operacje type="button" name="=" value=" = "
onclick="klawisz(11,'=')"></td>
</tr>
<tr align=center>
<td colspan=4><div id="opcje">
<input class=kalkulator_operacje_zaawansowane type="button" name="sqrt" value="sqrt"
onclick="klawisz(11,'sqrt')">
<input class=kalkulator_operacje_zaawansowane type="button" name="exp" value="exp"
onclick="klawisz(11,'exp')">
<input class=kalkulator_operacje_zaawansowane type="button" name="1/x" value="1/x
" onclick="klawisz(11,'1/x')">
</div>
<script language="javascript" type="text/javascript"><!--
ShowHideLayer("opcje",false);
//--></script>
</td>
</tr>
</table>
</form>
- wówczas nasz praktyczny kalkulator zacznie już działać :)
- w celu konfiguracji wyglądu zewnętrznego kalkulatora zapraszamy do pliku "kalk.css",
gdzie znajdziemy ustawienia (w następujących klasach):
- kalkulator_ekran - ekraniku;
- kalkulator_tlo - tła;
- kalkulator_opcje - przycisku "Opcje";
- kalkulator_cyfry - cyferblatu (cyfry 0-9);
- kalkulator_operacje - cyferblatu (działania)
- kalkulator_operacje_zaawansowane - cyferblatu (dodatkowe działania)
Życzymy przyjemnego użytkowania!!!
Copyright © 2002 Emil Nowak & Jakub Kręcicki.
|
|