- <html lang="pl">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" c initial-scale=1.0">
- <title>Document</title>
- <link rel="stylesheet" href="style.css">
- </head>
- [removed][removed]
- <body>
- <img src="cloud.webp" 120%;
- margin-top: -40px;
- height: 200px;
- transform: rotateX(180deg);">
- <div class="calc">
- <input type="text" id="liczba1" placeholder="X">
- <select class="type_input">
- <option value="dodaj" >+</option>
- <option value="odejmij" >-</option>
- <option value="mnoz" >*</option>
- <option value="dziel" >/</option>
- <option value="poteguj" >^</option>
- <option value="pierwiastkuj" >v</option>
- </select>
- <input type="text" id="liczba2" placeholder="Y">
- </div>
- <div class="koniec">
- <h2>Wynik:</h2>
- <div id="wynik"></div>
- </div>
- <div class="inp">
- <label for="losowanie"><input type="checkbox" id="losowanie" value="losowanie">Losowanie (x do y)</label>
- <label for="pokaz"><input type="checkbox" id="pokaz" value="pokaz">Pokaż wynik bezwzględny</label>
- <label for="wieksza"><input type="checkbox" id="wieksza" value="wieksza">Zwróć największą liczbę całkowitą mniejszą lub równą wynikowi</label>
- <label for="mniejsza"><input type="checkbox" id="mniejsza" value="mniejsza">Zwróć najmniejszą liczbę całkowitą większą lub równą wynikowi</label>
- </div>
- <img src="cloud.webp" 120%;
- height: 200px;">
- </body>
- </html>
- body{
- background-color: rgba(202, 234, 239, 0.609);
- }
- div.calc{
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- }
- div.calc input{
- margin: 10px;
- border: solid rgb(248, 188, 198);
- border-radius: 20px;
- text-align: center;
- color: blue;
- background-color: rgba(241, 212, 217, 0.72);
- width: 100px;
- height: 40px;
- }
- div.calc select{
- margin: 10px;
- border: solid pink;
- border-radius: 15px;
- text-align: center;
- color: blue;
- background-color: rgba(241, 212, 217, 0.72);
- width: 60px;
- height: 30px;
- }
- div.koniec{
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- color: blue;
- }
- h2{
- text-align: center;
- }
- #wynik{
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- font-size: 25px;
- padding-left: 3px;
- }
- div.inp{
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- padding-top: 50px;
- }
- function dodaj(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik1=liczba1+liczba2;
- document.getElementById("wynik")[removed]=wynik1;
- }
- function odejmij(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik2=liczba1-liczba2;
- document.getElementById("wynik")[removed]=wynik2;
- }
- function mnoz(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik3=liczba1*liczba2;
- document.getElementById("wynik")[removed]=wynik3;
- }
- function dziel(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik4=liczba1/liczba2;
- document.getElementById("wynik")[removed]=wynik4;
- }
- function poteguj(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik5=Math.pow(liczba1,liczba2);
- document.getElementById("wynik")[removed]=wynik5;
- }
- function pierwiastkuj(){
- var liczba1=parseInt(document.getElementById("liczba1").value);
- var liczba2=parseInt(document.getElementById("liczba2").value);
- var wynik6=liczba2**(1/liczba1)
- document.getElementById("wynik")[removed]=wynik6;
- }