BrandonMach.github.io/joseph.html at master · BrandonMach/BrandonMach.github.io · GitHub

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
<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Jojo Part 2</title>
  <link rel="stylesheet" href="style.css">
  <link rel="stylesheet" href="grid-style.css">
  <link href="https://fonts.googleapis.com/css?family=EB+Garamond&7cGFS+Didot&display=swap" rel="stylesheet">
</head>

<body>
  <header>
    <img id="Hotel_fasad" src="img/jojo-logo.png" alt="Jojo logo">

    <div class="namn_bakgrund">
      <div class="placering_logo">
        <h1 id=namn> Jojo's Bizarre Adventure</h1>
      </div>
    </div>
  </header>
  <nav>
    <div class="nav_center">
      <a class="hem" href="index.html"><img src="img/part1.png" alt="stone mask"></a>
      <a class="hitta" href="joseph.html"><img src="img/part2.png" alt="red stone of aja"></a>
      <a class="boka" href="jotaro.html"><img src="img/part3.png" alt="jotaro hat pin"></a>
      <a class="hotellet" href="josuke.html"><img src="img/part4.png" alt="josuke pin"></a>
      <a class="hotellet" href="giorno.html"><img src="img/part5.png" alt="Giorno ladybug"></a>
      <a class="hotellet" href="jolyne.html"><img src="img/part6.png" alt="Jolyne tatto"></a>
      <a class="hotellet" href="johnny.html"><img src="img/part7.png" alt="Hores shoe"></a>
      <a class="hotellet" href="josuke8.html"><img src="img/part8.png" alt="Ancher"></a>
    </div>

    <!--inte klar än-->
  </nav>
  <main>
    <div class="slideshow-container">

      <!-- Full-width images with number and caption text -->
      <div class="mySlides fade">
        <div class="numbertext">1 / 3</div>
        <img class="joseph-part2" src="img/joseph-part2.png" alt="joseph part 2" style="width:100%; border-radius: 15px;">
      </div>

      <div class="mySlides fade">
        <div class="numbertext">2 / 3</div>
        <img src="img/joseph-part3.png"  alt="joseph part 3" style="width:100%; border-radius: 15px;">
      </div>

      <div class="mySlides fade">
        <div class="numbertext">3 / 3</div>
        <img src="img/joseph-part4.png" alt="joseph part 4" style="width:100%; border-radius: 15px;">
      </div>

      <!-- Next and previous buttons -->
      <a class="prev" onclick="plusSlides(-1)">&#10094;</a>
      <a class="next" onclick="plusSlides(1)">&#10095;</a>
    </div>
    <br>

    <!-- The dots/circles -->
    <div style="text-align:center">
      <span class="dot" onclick="currentSlide(1)"></span>
      <span class="dot" onclick="currentSlide(2)"></span>
      <span class="dot" onclick="currentSlide(3)"></span>
    </div>


      <script type="text/javascript">
      var slideIndex = 1;
    showSlides(slideIndex);

    // Next/previous controls
    function plusSlides(n) {
      showSlides(slideIndex += n);
    }

    // Thumbnail image controls
    function currentSlide(n) {
      showSlides(slideIndex = n);
    }

    function showSlides(n) {
      var i;
      var slides = document.getElementsByClassName("mySlides");
      var dots = document.getElementsByClassName("dot");
      if (n > slides.length) {slideIndex = 1}
      if (n < 1) {slideIndex = slides.length}
      for (i = 0; i < slides.length; i++) {
          slides[i].style.display = "none";
      }
      for (i = 0; i < dots.length; i++) {
          dots[i].className = dots[i].className.replace(" active", "");
      }
      slides[slideIndex-1].style.display = "block";
      dots[slideIndex-1].className += " active";
    }

      </script>


    </main>

    <section>
      <article class="rum 1">
        <p>Joseph Joestar (ジョセフ・ジョースター Josefu Jōsutā) is the main protagonist of part 2 and an ally in part 3 and 4. He is the 2nd JoJo of the JoJo's Bizarre Adventure series.

  Joseph is a natural-born Ripple user and eventual Stand user, wielding the psychic photographic Stand, Hermit Purple. An exuberant trickster, Joseph meets the fantastic threats approaching him throughout his life with initiative and impressive ingenuity, battling Vampires, the Pillar Men, and malevolent Stand users.

  He is the second most recurring JoJo in the series after his grandson Jotaro Kujo and is one of its most well known characters.</p>
  <h1>Stand: Hermit Purple</h1>
  <img class="hermit" src="img/hermit-purple.jpg" alt="Hermit Purple">
  <p>Hermit Purple manifests itself as multiple, purple, thorn-covered vines that spawn from Joseph's hands. The vines are strong enough to support his own weight and long enough to bind someone completely.

Hermit Purple is consistently portrayed as being purple across all media featuring it, befitting its name.

Hermit Purple represents the TarotW Card The HermitW, which symbolizes introspection and contemplation, best represented in the Stand's powers of divination.</p>
  <a href="next-you'll-say.html">Click Here to win 1 000 000 Dollars</a>

      </article>

  </section>
  <footer>
    <p> Bright Hotell | Storgatan 1 | 123 45 Storstad | 012 - 12 34 56
      <br><a id="epostadress" href="mailto:testadress@mail.com">Brighthotell@mail.som</a>
    </p>

  </footer>

</body>

</html>