ToriWebsite/index.html at master · mwilson96/ToriWebsite · 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
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Tori's Website </title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  <script src="js/my.js"></script>
  <link rel="stylesheet" type="text/css" href="style.css">
  <style>

  </style>
</head>

<body>
  <div class="dropdown">
    <div id="bars" class="dropbtn">
      <div class="bar1"></div>
      <div class="bar2"></div>
      <div class="bar3"></div>
    </div>
    <div id="toriWeb" class="webname">T O R I P E N A K . C A</div>
    <div id="myDropdown" class="smallnav">
      <a class="link" href="#">HOME</a>
      <a class="link" href="#">ABOUT</a>
      <a class="link" href="#">CLASS</a>
      <a class="link" href="#">GALLERY</a>
      <a class="link" href="#">CONTACT</a>
    </div>
  </div>

  <div class="content">

    <div id="vanish" class="topbar">
      <div class="Title">
        <h1> <a class="ToriLogo" href="index.html">Miss Penak</a></h1>
        <p class="webname">T O R I P E N A K . C A</p>
      </div>
      <div class="navbar">
        <a class="link" href="index.html">HOME</a>
        <a class="link" href="index.html">ABOUT</a>
        <a class="link" href="index.html">CLASS</a>
        <a class="link" href="index.html">GALLERY</a>
        <a class="link" href="index.html">CONTACT</a>
      </div>
    </div>
    <div class="mainbar">
      <div class="rightbar">
        <p>SCROLL DOWN TO TEST navbar
          <br>
          <br>
          RIGHT BAR Lorem ipsum enim magna metus neque non dui semper, convallis hac convallis ligula lacinia donec orci mauris, diam pulvinar id aliquam cursus aenean ullamcorper elementum blandit lectus habitasse ligula ac luctus tincidunt elit torquent.
          Euismod rutrum amet et tempor vehicula sagittis lectus arcu malesuada, sollicitudin eros potenti facilisis quam cursus sapien ut, nisl ut semper ullamcorper aliquet accumsan commodo pharetra curabitur odio consequat ad porttitor faucibus posuere.
          Magna sodales nunc accumsan consectetur ligula id cubilia cras, lacus vulputate lacus amet curabitur consectetur nisl condimentum morbi, malesuada magna ante porta consequat sollicitudin ornare.
          Nostra est aliquam nulla ultricies proin tortor lacinia vitae, quisque fermentum tempor pharetra quisque convallis hac vitae, quisque faucibus class lacus sapien inceptos lobortis.
          At etiam sapien accumsan vulputate luctus potenti, a augue sociosqu volutpat ligula, phasellus sem imperdiet sodales dapibus posuere in curabitur dapibus semper dolor, vitae aliquam venenatis quisque gravida vel, etiam lacinia et purus.</p>
      </div>

      <div class="leftbar">
        <p>LEFT BAR Lorem ipsum enim magna metus neque non dui semper, convallis hac convallis ligula lacinia donec orci mauris, diam pulvinar id aliquam cursus aenean ullamcorper elementum blandit lectus habitasse ligula ac luctus tincidunt elit torquent.
          Euismod rutrum amet et tempor vehicula sagittis lectus arcu malesuada, sollicitudin eros potenti facilisis quam cursus sapien ut, nisl ut semper ullamcorper aliquet accumsan commodo pharetra curabitur odio consequat ad porttitor faucibus posuere.
          Magna sodales nunc accumsan consectetur ligula id cubilia cras, lacus vulputate lacus amet curabitur consectetur nisl condimentum morbi, malesuada magna ante porta consequat sollicitudin ornare.
          Nostra est aliquam nulla ultricies proin tortor lacinia vitae, quisque fermentum tempor pharetra quisque convallis hac vitae, quisque faucibus class lacus sapien inceptos lobortis.
          At etiam sapien accumsan vulputate luctus potenti, a augue sociosqu volutpat ligula, phasellus sem imperdiet sodales dapibus posuere in curabitur dapibus semper dolor, vitae aliquam venenatis quisque gravida vel, etiam lacinia et purus.
          <br>
          <p>Lorem ipsum enim magna metus neque non dui semper, convallis hac convallis ligula lacinia donec orci mauris, diam pulvinar id aliquam cursus aenean ullamcorper elementum blandit lectus habitasse ligula ac luctus tincidunt elit torquent.
            Euismod rutrum amet et tempor vehicula sagittis lectus arcu malesuada, sollicitudin eros potenti facilisis quam cursus sapien ut, nisl ut semper ullamcorper aliquet accumsan commodo pharetra curabitur odio consequat ad porttitor faucibus posuere.
            Magna sodales nunc accumsan consectetur ligula id cubilia cras, lacus vulputate lacus amet curabitur consectetur nisl condimentum morbi, malesuada magna ante porta consequat sollicitudin ornare.
            Nostra est aliquam nulla ultricies proin tortor lacinia vitae, quisque fermentum tempor pharetra quisque convallis hac vitae, quisque faucibus class lacus sapien inceptos lobortis.
            At etiam sapien accumsan vulputate luctus potenti, a augue sociosqu volutpat ligula, phasellus sem imperdiet sodales dapibus posuere in curabitur dapibus semper dolor, vitae aliquam venenatis quisque gravida vel, etiam lacinia et purus.</p>

            <p>Lorem ipsum enim magna metus neque non dui semper, convallis hac convallis ligula lacinia donec orci mauris, diam pulvinar id aliquam cursus aenean ullamcorper elementum blandit lectus habitasse ligula ac luctus tincidunt elit torquent.
              Euismod rutrum amet et tempor vehicula sagittis lectus arcu malesuada, sollicitudin eros potenti facilisis quam cursus sapien ut, nisl ut semper ullamcorper aliquet accumsan commodo pharetra curabitur odio consequat ad porttitor faucibus posuere.
              Magna sodales nunc accumsan consectetur ligula id cubilia cras, lacus vulputate lacus amet curabitur consectetur nisl condimentum morbi, malesuada magna ante porta consequat sollicitudin ornare.
              Nostra est aliquam nulla ultricies proin tortor lacinia vitae, quisque fermentum tempor pharetra quisque convallis hac vitae, quisque faucibus class lacus sapien inceptos lobortis.
              At etiam sapien accumsan vulputate luctus potenti, a augue sociosqu volutpat ligula, phasellus sem imperdiet sodales dapibus posuere in curabitur dapibus semper dolor, vitae aliquam venenatis quisque gravida vel, etiam lacinia et purus.</p>

              <p>Lorem ipsum enim magna metus neque non dui semper, convallis hac convallis ligula lacinia donec orci mauris, diam pulvinar id aliquam cursus aenean ullamcorper elementum blandit lectus habitasse ligula ac luctus tincidunt elit torquent.
                Euismod rutrum amet et tempor vehicula sagittis lectus arcu malesuada, sollicitudin eros potenti facilisis quam cursus sapien ut, nisl ut semper ullamcorper aliquet accumsan commodo pharetra curabitur odio consequat ad porttitor faucibus posuere.
                Magna sodales nunc accumsan consectetur ligula id cubilia cras, lacus vulputate lacus amet curabitur consectetur nisl condimentum morbi, malesuada magna ante porta consequat sollicitudin ornare.
                Nostra est aliquam nulla ultricies proin tortor lacinia vitae, quisque fermentum tempor pharetra quisque convallis hac vitae, quisque faucibus class lacus sapien inceptos lobortis.
                At etiam sapien accumsan vulputate luctus potenti, a augue sociosqu volutpat ligula, phasellus sem imperdiet sodales dapibus posuere in curabitur dapibus semper dolor, vitae aliquam venenatis quisque gravida vel, etiam lacinia et purus.</p>

      </div>


    </div>

  </div>

</body>

</html>