Init commit
7
bootstrap.min.css
vendored
Normal file
7
bootstrap.min.js
vendored
Normal file
15
formulajsfeladat.txt
Normal file
|
@ -0,0 +1,15 @@
|
|||
1. Oldja meg az index.html oldal Átlagsebesség számítása szakaszában, hogy a Pálya
|
||||
kiválasztásakor és/vagy egy köridő beírásakor a main.js "calculate" függvénye legyen végrehajtva!
|
||||
2. A main.js állományban készítse el a showcircuit függvény törzsét! Amennyiben a Pálya listából
|
||||
van kiválasztott pálya, akkor annak képe jelenjen meg az oldal baloldalán a circuitimage azonosítójú
|
||||
szakaszban!
|
||||
3. A main.js állományban készítse el a calculate függvény törzsét! A függvénynek a
|
||||
pálya hosszából és a köridőből kell átlagsebességet számolnia: a kiválasztott pálya hosszát
|
||||
kell elosztani a köridővel (a köridőt – mivel másodpercben van megadva – el kell osztani
|
||||
3600-zal). Az egyes pályák hossza km-ben:
|
||||
− Hungaroring (HUN): 4,381 km
|
||||
− Monaco (MON): 3,337 km
|
||||
− Spa-Francorchamps (BEL): 7,004 km
|
||||
− Monza (ITA): 5,793 km
|
||||
A kapott eredményt – mértékegységgel (km/h) együtt – jelenítse meg az átlagsebesség
|
||||
(averagespeed azonosítójú) mezőben!
|
BIN
fromula-one-car-sound.mp3
Normal file
BIN
img/circuits2019.jpg
Normal file
After Width: | Height: | Size: 77 KiB |
BIN
img/ferrari.jpg
Normal file
After Width: | Height: | Size: 33 KiB |
BIN
img/hungaroring.jpg
Normal file
After Width: | Height: | Size: 33 KiB |
BIN
img/juan_manuel-fangio.jpg
Normal file
After Width: | Height: | Size: 35 KiB |
BIN
img/louis_chiron.jpg
Normal file
After Width: | Height: | Size: 36 KiB |
BIN
img/max_verstappen.jpg
Normal file
After Width: | Height: | Size: 44 KiB |
BIN
img/michael_schumacher.jpg
Normal file
After Width: | Height: | Size: 104 KiB |
BIN
img/monaco.jpg
Normal file
After Width: | Height: | Size: 52 KiB |
BIN
img/monaco1955.jpg
Normal file
After Width: | Height: | Size: 588 KiB |
BIN
img/monaco1977.jpg
Normal file
After Width: | Height: | Size: 134 KiB |
BIN
img/monaco2010.jpg
Normal file
After Width: | Height: | Size: 259 KiB |
BIN
img/monza.jpg
Normal file
After Width: | Height: | Size: 40 KiB |
BIN
img/monza_info.jpg
Normal file
After Width: | Height: | Size: 40 KiB |
BIN
img/rubens_barrichello.jpg
Normal file
After Width: | Height: | Size: 63 KiB |
BIN
img/spa.jpg
Normal file
After Width: | Height: | Size: 28 KiB |
239
index.html
Normal file
|
@ -0,0 +1,239 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="hu">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="bootstrap.min.css">
|
||||
<link rel="stylesheet" href="site.css">
|
||||
<title>Forma-1</title>
|
||||
<script src="jquery.min.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav class="sidebar navbar navbar-expand-lg navbar-dark bg-dark d-lg-block">
|
||||
<h1 class="navbar-brand">
|
||||
FORMULA ONE
|
||||
</h1>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarNavDropdown">
|
||||
<ul class="navbar-nav flex-column">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link text-white" href="#home">Kezdőlap</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#history">Történet</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#records">"Leg"-ek</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link text-white" href="#avgspeed">Átlagsebességek</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="main-content">
|
||||
<section id="home" class="section-100 bg-image">
|
||||
<h1 class="text-center">Érdekességek a Forma-1 világából</h1>
|
||||
</section>
|
||||
|
||||
<section id="history" class="section-100 bg-image p-2">
|
||||
<h2 class="text-center py-3">Története</h2>
|
||||
|
||||
<h3>A kezdetek:</h3>
|
||||
<p>
|
||||
A Forma-1 gyökerei egészen a 20. század első éveiig vezethetők vissza, az autóversenyzés bölcsőjébe, Franciaországba. Az első nagydíjat, grand prix-t 1906-ban
|
||||
rendezték, a Renault-t vezető győztes pedig nem volt más, mint a magyar Szisz Ferenc.
|
||||
</p>
|
||||
<h3>A Forma-1 születése:</h3>
|
||||
<p>
|
||||
Már a 30-as években felmerült a grand prix-k világbajnokságba való szervezése, de a második világháború közbeszólt, így az európai autóversenyzés csak a 40-es évek
|
||||
végén éledt újra. Az első bajnoki idényt pedig 1950-ben rendezték, a legelső futam a silverstone-i Brit Nagydíj volt.
|
||||
</p>
|
||||
<h3>A Forma-1 aranykora:</h3>
|
||||
<p>
|
||||
Az F1-be 1977-ben belépő Renault hozta a sportág következő nagy újítását. A francia gyártó turbómotorjai kezdetben ugyan siralmasan megbízhatatlanok voltak, de a
|
||||
technológia elterjedt és egy évtizedig uralta a száguldó cirkuszt, az erőforrások az egészen elképesztő, 1000 lóerő feletti teljesítményt is hozták. Manapság talán
|
||||
az 1980-as évekre tekintenek legtöbben aranykorként, amikor Nelson Piquet, Alain Prost, Nigel Mansell, Ayrton Senna küzdött a Brabham, a McLaren, a Lotus és a
|
||||
Williams autóiban ülve.
|
||||
</p>
|
||||
|
||||
<h3>A '90-es évek:</h3>
|
||||
<p>
|
||||
A Forma-1-ben tulajdonképpen csak Mansell '92-es révbe érése, Prost '93-as visszavonulása és Senna '94-es halála zárta le végleg a 80-as éveket, ezután emelkedtek
|
||||
fel a korszak új sztárjai.
|
||||
</p>
|
||||
|
||||
<h3>Napjaink:</h3>
|
||||
<p>
|
||||
A Ferrari és Schumacher totálisan uralta a 2000-es évtized elejét, öt éven keresztül minden bajnoki címet begyűjtött. A Renault és Fernando Alonso 2005-2006-ban
|
||||
törte
|
||||
meg a sorozatot, a főszerep ezután már a következő generációé, napjaink sztárjaié lett.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section id="records">
|
||||
<div class="row mx-0">
|
||||
<div class="bg-black col-sm-12 col-md-6 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Legtöbb nagydíj
|
||||
</h3>
|
||||
<div class="row">
|
||||
<img class="col-sm-4" src="img/rubens_barrichello.jpg" alt="Rubens Barrichello">
|
||||
<div class="col-sm-8">
|
||||
<ol>
|
||||
<li class="font-weight-bold">Rubens Barrichello (326)</li>
|
||||
<li>Kimi Räikkönen (315)</li>
|
||||
<li>Fernando Alonso (314)</li>
|
||||
<li>Jenson Button (309)</li>
|
||||
<li>Michael Schumacher (308)</li>
|
||||
<li>Felipe Massa (272)</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-6 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Legtöbb megnyert futam
|
||||
</h3>
|
||||
<div class="row">
|
||||
<img class="col-sm-4" src="img/michael_schumacher.jpg" alt="Michael Schumacher">
|
||||
<div class="col-sm-8">
|
||||
<ol>
|
||||
<li class="font-weight-bold">Michael Schumacher (91)</li>
|
||||
<li>Lewis Hamilton (84)</li>
|
||||
<li>Sebastian Vettel (53)</li>
|
||||
<li>Alain Prost (51)</li>
|
||||
<li>Ayrton Senna (41)</li>
|
||||
<li>Fernando Alonso (32)</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-6 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Bajnoki címek
|
||||
</h3>
|
||||
<div class="row">
|
||||
<img class="col-sm-4" src="img/juan_manuel-fangio.jpg" alt="Juan Manuel Fangio">
|
||||
<div class="col-sm-8">
|
||||
<ol>
|
||||
<li>Michael Schumacher (7)</li>
|
||||
<li>Lewis Hamilton (6)</li>
|
||||
<li class="font-weight-bold">Juan Manuel Fangio (5)</li>
|
||||
<li>
|
||||
Alain Prost (4)
|
||||
<br>
|
||||
Sebastian Vettel (4)
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-6 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Csapat bajnoki címek
|
||||
</h3>
|
||||
<div class="row">
|
||||
<img class="col-sm-4" src="img/ferrari.jpg" alt="Ferrari">
|
||||
<div class="col-sm-8">
|
||||
<ol>
|
||||
<li class="font-weight-bold">Ferrari (16)</li>
|
||||
<li>Williams (9)</li>
|
||||
<li>McLaren (8)</li>
|
||||
<li>Lotus (7)</li>
|
||||
<li>Mercedes (6)</li>
|
||||
<li>Red Bull (4)</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-4 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Legfiatalabb versenyző
|
||||
</h3>
|
||||
<img src="img/max_verstappen.jpg" alt="Max Verstappen" width="100%">
|
||||
<p class="text-center">
|
||||
Max Verstappen 2015-ben 17 éves és 166 napos korában indult az Osztrák nagydíjon.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-4 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Legidősebb versenyző
|
||||
</h3>
|
||||
<img src="img/louis_chiron.jpg" alt="Louis Chiron" width="100%">
|
||||
<p class="text-center">
|
||||
Louis Chiron 58 évesen és 288 naposan állt rajthoz 1958-ban Monacoban.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-black col-sm-12 col-md-4 p-3">
|
||||
<h3 class="bg-dark p-2 col-sm-12 text-center">
|
||||
Legtöbb Grand Prix
|
||||
</h3>
|
||||
<img src="img/monza_info.jpg" alt="Monza" width="100%">
|
||||
<p class="text-center">
|
||||
1950 óta a legtöbb versenyt az olaszországi Monzában rendezték.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="avgspeed" class="section-100 bg-image p-2">
|
||||
<h2 class="text-center py-3">Átlagsebesség számítás</h2>
|
||||
<div class="row mx-0">
|
||||
<div id="circuitimage" class=".d-none .d-md-block col-md-5">
|
||||
<!-- Pálya képét ide kell beilleszteni-->
|
||||
</div>
|
||||
<form class="col-md-5 offset-md-1">
|
||||
<div class="form-group">
|
||||
<label for="circuit">Pálya</label>
|
||||
<select class="form-control" id="circuit" onchange="">
|
||||
<option value=""></option>
|
||||
<option value="HUN">Hungaroring</option>
|
||||
<option value="MON">Monaco</option>
|
||||
<option value="ITA">Monza</option>
|
||||
<option value="BEL">Spa-Francorchamps</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="laptime">1 kör ideje (másodpercben)</label>
|
||||
<input type="number" class="form-control" id="laptime" placeholder="pl.: 105.954" oninput="">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="averagespeed">Átlagsebesség</label>
|
||||
<input type="text" class="form-control" id="averagespeed" readonly>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<audio id="f1sound">
|
||||
<source src="fromula-one-car-sound.mp3" type="audio/mpeg">
|
||||
</audio>
|
||||
|
||||
<footer class="text-right p-2">
|
||||
Források: <a href="http://formula.uw.hu/f1tortenet.html">F1 történet</a>, <a href="https://en.wikipedia.org/wiki/List_of_Formula_One_driver_records">Wikipedia</a>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="popper.min.js"></script>
|
||||
<script src="bootstrap.min.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
2
jquery.min.js
vendored
Normal file
11
legek.txt
Normal file
|
@ -0,0 +1,11 @@
|
|||
Legfiatalabb versenyző
|
||||
max_verstappen.jpg Max Verstappen
|
||||
Max Verstappen 2015-ben 17 éves és 166 napos korában indult az Osztrák nagydíjon.
|
||||
|
||||
Legidősebb versenyző
|
||||
louis_chiron.jpg Louis Chiron
|
||||
Louis Chiron 58 évesen és 288 naposan állt rajthoz 1958-ban Monacoban.
|
||||
|
||||
Legtöbb Grand Prix
|
||||
monza_info.jpg Monza
|
||||
1950 óta a legtöbb versenyt az olaszországi Monzában rendezték.
|
17
main.js
Normal file
|
@ -0,0 +1,17 @@
|
|||
$(document).ready(function () {
|
||||
$('.navbar-nav li').click(function (x) {
|
||||
$('.navbar-nav li').removeClass('active');
|
||||
$(event.target).parent().addClass('active');
|
||||
});
|
||||
});
|
||||
|
||||
function showCircuit() {
|
||||
//A listából kiválasztott kép megjelenítése az id="circuitimage" div-ben
|
||||
}
|
||||
|
||||
//---------------------------------------------------------
|
||||
|
||||
function calculate() {
|
||||
showCircuit();
|
||||
//Ha van kiválasztott pálya és beírt köridő, akkor a pályának megfelelő átlagsebesség kiszámítása és megjelenítése az id="averagespeed" input mezőben
|
||||
}
|
5
popper.min.js
vendored
Normal file
93
site.css
Normal file
|
@ -0,0 +1,93 @@
|
|||
body {
|
||||
background-color: black;
|
||||
color: white;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
.bg-black {
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
.sidebar h1 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.sidebar {
|
||||
height: 100vh;
|
||||
width: 250px;
|
||||
min-height: 400px;
|
||||
overflow: auto;
|
||||
padding: 30px;
|
||||
position: fixed;
|
||||
}
|
||||
}
|
||||
|
||||
.active>.nav-link {
|
||||
color: #ff2800 !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.main-content {
|
||||
float: right;
|
||||
width: calc(100% - 250px);
|
||||
}
|
||||
footer {
|
||||
float: right;
|
||||
width: calc(100% - 250px);
|
||||
}
|
||||
}
|
||||
|
||||
.bg-image {
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.section-100 {
|
||||
min-height: 100vh;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#home {
|
||||
background-image: url('img/monaco2010.jpg');
|
||||
}
|
||||
|
||||
#home h1 {
|
||||
padding-top: 30vh;
|
||||
font-size: 3rem;
|
||||
text-shadow: 2px 2px #ff2800;
|
||||
}
|
||||
|
||||
#history {
|
||||
background-image: url('img/monaco1955.jpg');
|
||||
text-shadow: 1.5px 1.5px #ff2800;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
p {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.row > img{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#avgspeed {
|
||||
background-image: url('img/circuits2019.jpg');
|
||||
text-shadow: 0.5px 0.5px #ff2800;
|
||||
}
|
||||
|
||||
footer a, footer a:visited {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
}
|
15
tortenete.txt
Normal file
|
@ -0,0 +1,15 @@
|
|||
Története
|
||||
A kezdetek:
|
||||
A Forma-1 gyökerei egészen a 20. század első éveiig vezethetők vissza, az autóversenyzés bölcsőjébe, Franciaországba. Az első nagydíjat, grand prix-t 1906-ban rendezték, a Renault-t vezető győztes pedig nem volt más, mint a magyar Szisz Ferenc.
|
||||
|
||||
A Forma-1 születése:
|
||||
Már a 30-as években felmerült a grand prix-k világbajnokságba való szervezése, de a második világháború közbeszólt, így az európai autóversenyzés csak a 40-es évek végén éledt újra. Az első bajnoki idényt pedig 1950-ben rendezték, a legelső futam a silverstone-i Brit Nagydíj volt.
|
||||
|
||||
A Forma-1 aranykora:
|
||||
Az F1-be 1977-ben belépő Renault hozta a sportág következő nagy újítását. A francia gyártó turbómotorjai kezdetben ugyan siralmasan megbízhatatlanok voltak, de a technológia elterjedt és egy évtizedig uralta a száguldó cirkuszt, az erőforrások az egészen elképesztő, 1000 lóerő feletti teljesítményt is hozták. Manapság talán az 1980-as évekre tekintenek legtöbben aranykorként, amikor Nelson Piquet, Alain Prost, Nigel Mansell, Ayrton Senna küzdött a Brabham, a McLaren, a Lotus és a Williams autóiban ülve.
|
||||
|
||||
A '90-es évek:
|
||||
A Forma-1-ben tulajdonképpen csak Mansell '92-es révbe érése, Prost '93-as visszavonulása és Senna '94-es halála zárta le végleg a 80-as éveket, ezután emelkedtek fel a korszak új sztárjai.
|
||||
|
||||
Napjaink:
|
||||
A Ferrari és Schumacher totálisan uralta a 2000-es évtized elejét, öt éven keresztül minden bajnoki címet begyűjtött. A Renault és Fernando Alonso 2005-2006-ban törte meg a sorozatot, a főszerep ezután már a következő generációé, napjaink sztárjaié lett.
|