-
-
Notifications
You must be signed in to change notification settings - Fork 1
/
weightlifting.html
152 lines (125 loc) · 4.13 KB
/
weightlifting.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WEIGHTLIFTING</title>
<style type="text/css">
#slide{
width:96%;
}
* {
box-sizing: border-box;
text-transform: capitalize;
}
.mySlides {
display: none
}
.slideshow-container {
width: 1200px;
position: relative;
margin: -10px;
}
.prev, .next {
cursor:progress;
position: absolute;
top: 50%;
width: auto;
padding: 16px;
margin-top: -22px;
color: black;
font-weight: bolder;
font-size: 18px;
transition: 0.6s ease;
border-radius: 0 5px 5px 0;
}
.next {
right: 0;
border-radius: 5px 0 0 5px;
}
.prev {
left: 0;
border-radius: 5px 0 0 5px;
}
p{
font-size: 20px;
}
body{
background-color: black;
color: white;
}
div.y{
text-align: left;
}
</style>
</head>
<body>
<h1 align="center" style="font-size: 50px;">WEIGHTLIFTING</h1>
<div align="center">
<br>
<div id="slide" align="center">
<div class="slideshow-container">
<div class="mySlides fade"> <img src="images/weightlifting.jpg" height="600px" width="1000px;" style="width:100%"> </div>
<div class="mySlides fade"> <img src="images/weightlifting1.jpg" height="600px" width="1000px;" style="width:100%"> </div>
<div class="mySlides fade"> <img src="images/weightlifting2.jpg" height="600px" width="1000px;" style="width:100%"> </div>
<div class="mySlides fade"> <img src="images/weightlifting3.jpg" height="600px" width="1000px;" style="width:100%"> </div>
<a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> </div>
<br>
<script type="text/javascript">
var slideIndex = 0;
showSlides();
var slides;
function showSlides() {
var i;
slides = document.getElementsByClassName("mySlides");
dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex> slides.length) {slideIndex = 1}
slides[slideIndex-1].style.display = "block";
setTimeout(showSlides, 2000); // Change image every 2 seconds
}
function plusSlides(position) {
slideIndex +=position;
if (slideIndex> slides.length) {slideIndex = 1}
else if(slideIndex<1){slideIndex = slides.length}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slides[slideIndex-1].style.display = "block";
}
function currentSlide(index) {
if (index> slides.length) {index = 1}
else if(index<1){index = slides.length}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slides[index-1].style.display = "block";
dots[index-1].className += " active";
}
</script>
<div class="y">
<h3 style="color: blue; font-size: 30px;">Equipment:</h3>
<p>kettlebells, dumbbells, training ropes, cable equipment, and free weight equipment </p>
<h3 style="color: blue; font-size: 30px;">Benefits:</h3>
<p> increase your physical work capacity , It improves bone density , Increases the strength of connective tissue, muscles, and tendons </p>
<h3 style="color: blue; font-size: 30px;">Safety:</h3>
<p> Don't hyperventilate (breathe in and out fast) or hold your breath when you lift heavy weights. ... Don't "cheat" on your technique to lift heavier weights than you can handle. Don't lift heavy weights without spotters. Don't lift more than you know you can lift safely.</p>
<h3 style="color: blue; font-size: 30px;">Duration and frequency:</h3>
<p>Weight training for 20 to 30 minutes, 2 to 3 times a week is enough to see results. You should try to target all your major muscle groups at least twice throughout your weekly workouts. </p>
<h3 style="color: blue; font-size: 30px;">If you're a beginner:</h3>
<p>
<ol style="font-size: 23px;">
<li>Warm up. ...</li>
<li>Start with lighter weights. ...</li>
<li>Gradually increase the weight. ...</li>
<li>Rest for at least 60 seconds in between sets. ...</li>
<li>Limit your workout to no longer than 45 minutes. ...</li>
<li>Gently stretch your muscles after your workout. ...</li>
<li>Rest a day or two in between workouts.</li>
</ol>
</p>
</div>
</body>
</html>