htamas1210/bereg-weblap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

timer done

Browse Source
This commit is contained in:
thewarrior1220
2022-02-18 11:26:42 +01:00
parent 2d517961a9
commit 57ea676b77
3 changed files with 51 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
index.html
View File

@@ -6,7 +6,7 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="style.css">
<!--<script src="timer.js"></script>-->
<script src="timer.js"></script>
<!--<script src="navbar.js"></script>-->
<title>DSZC Beregszászi Pál Technikum</title>
</head>
@@ -14,7 +14,7 @@
<header>
<nav class="">
<div class="">
<ul>
<ul id="nav-item">
<li>Rólunk</li>
<li>Tanulóinknak</li>
<li>Hírek</li>
@@ -25,17 +25,12 @@
</ul>
</div>
</nav>
<!-- Carousel -->
<div id="carousel" class="carousel slide" data-bs-ride="carousel">
<!-- Indicators/dots -->
<div class="carousel-indicators">
<button type="button" data-bs-target="#carousel" data-bs-slide-to="0" class="active"></button>
<button type="button" data-bs-target="#carousel" data-bs-slide-to="1"></button>
<button type="button" data-bs-target="#carousel" data-bs-slide-to="2"></button>
</div>
<!-- The slideshow/carousel -->
<div class="carousel-inner">
<div class="carousel-item active">
<img src="res/bereg/1.png" alt="Los Angeles" class="kep d-block w-75">
@@ -47,7 +42,6 @@
<img src="res/bereg/3.png" alt="New York" class="kep d-block w-75">
</div>
</div>
<!-- Left and right controls/icons -->
<button class="carousel-control-prev" type="button" data-bs-target="#carousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon"></span>
</button>
@@ -55,7 +49,15 @@
<span class="carousel-control-next-icon"></span>
</button>
</div>
<div id="timer"></div>
<div id="timer">
<ul id="counter"><br><br>
<h1>Következő szünetig hátralévő idő</h1>
<li id="nap"></li>
<li id="ora"></li>
<li id="perc"></li>
<li id="mperc"></li>
</ul>
</div>
</header>
<div id="content">
<aside id="left">

29
style.css
View File

@@ -3,7 +3,7 @@ body{
color: yellow;
}
li{
#nav-item li{
list-style-type: none;
float: left;
padding: 1%;
@@ -13,14 +13,14 @@ ul{
/*margin-left: 20%;*/
}
li{
#nav-item li{
border-right: 1px solid white;
}
li:first-child{
#nav-item li:first-child{
border-left: 1px solid white;
margin-left: 20%;
}
li:last-child{
#nav-item li:last-child{
border-right: 1px solid white;
}
@@ -31,6 +31,25 @@ nav{
width: 100%;
}
#counter li{
float: left;
list-style-type: none;
font-size: 30px;
padding-left: 2%;
}
#counter h1{
margin-left: 1%;
}
#nap{
margin-left: 5%;
}
#timer{
margin-left: 25%;
}
.kep{
margin-left: 13%;
}

21
timer.js
View File

@@ -13,10 +13,21 @@ function updateTimer(){
m = mins - hours * 60;
s = secs - mins * 60;
document.getElementById("timer").innerHTML =
'<div>' + d + '<span>Nap</span></div>' +
'<div>' + h + '<span>Ora</span></div>' +
'<div>' + m + '<span>Perc</span></div>' +
'<div>' + s + '<span>Masodperc</span></div>';
d_sz = " " + d;
h_sz = " " + h;
m_sz = " " + m;
s_sz = " " + s;
document.getElementById("nap").innerHTML =
'<div>' + d_sz + '<span> Nap </span></div> ';
document.getElementById("ora").innerHTML =
'<div>' + h_sz + '<span> Ora </span></div> ';
document.getElementById("perc").innerHTML =
'<div>' + m_sz + '<span> Perc </span></div> ';
document.getElementById("mperc").innerHTML =
'<div>' + s_sz + '<span> Masodperc </span></div>';
}
setInterval('updateTimer()', 1000);