A Pen by Tom

Thumbnail
This awesome code was written by twwoodward, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright twwoodward ©
  • HTML
  • CSS
  • JavaScript
    <div class="subcontent col-md-6">

  <!--regular post content-->
  <div class="subcontent-1 subslide active" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/themes/histology/imgs/trans.png" alt="This is blank.">
    <h1 id="the_slide_title" class="slide-title">Bone remodeling</h1>
    <div id="the_slide_content">
      <p>These images, through the diaphysis of a long bone, demonstrate the multiple processes occurring during bone growth and development. The image on the right is later in time during the remodeling process than is the image on the left. 400x, 200x</p>
    </div>
  </div>

  <!--SLIDES BEGIN aka custom fields data-->

  <div class="subcontent-2 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P01-1.png" alt="Marrow space <p>These images, through the diaphysis of a long bone, demonstrate the multiple processes occurring during bone growth and development. The image on the right is later in time during the remodeling process than is the image on the left. 400x, 200x</p>
">

    <h3 class="slide-title">
      Marrow space </h3>

    <p>These images, through the diaphysis of a long bone, demonstrate the multiple processes occurring during bone growth and development. The image on the right is later in time during the remodeling process than is the image on the left. 400x, 200x</p>
  </div>
  <div class="subcontent-3 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P02.png" alt="Periosteum <p>These images, through the diaphysis of a long bone, demonstrate the multiple processes occurring during bone growth and development. The image on the right is later in time during the remodeling process than is the image on the left. 400x, 200x</p>
">

    <h3 class="slide-title">
      Periosteum </h3>

    <p>These images, through the diaphysis of a long bone, demonstrate the multiple processes occurring during bone growth and development. The image on the right is later in time during the remodeling process than is the image on the left. 400x, 200x</p>
  </div>
  <div class="subcontent-4 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P03.png" alt="Circumferential  lamellae > <p>Inner (1) and outer (2) circumferential lamellae can be seen on either surface of the bone, indicating an increase in the diameter of the bone. This increased diameter provides additional support as an individual grows in mass. Circumferential lamellae are deposited by intramembranous bone formation by the endosteal and periosteal membranes.</p>
">

    <h3 class="slide-title">
      Circumferential lamellae > </h3>

    <p>Inner (1) and outer (2) circumferential lamellae can be seen on either surface of the bone, indicating an increase in the diameter of the bone. This increased diameter provides additional support as an individual grows in mass. Circumferential lamellae
      are deposited by intramembranous bone formation by the endosteal and periosteal membranes.</p>
  </div>
  <div class="subcontent-5 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P04.png" alt="Calcified cartilage > <p>Islands of acellular tissue are present between the two stacks of circumferential lamellae and in the spongy bone. These areas represent the calcified cartilage remnants from the epiphyseal plate. The presence of this calcified cartilage indicates that this central area was produced by endochondral ossification.</p>
">

    <h3 class="slide-title">
      Calcified cartilage > </h3>

    <p>Islands of acellular tissue are present between the two stacks of circumferential lamellae and in the spongy bone. These areas represent the calcified cartilage remnants from the epiphyseal plate. The presence of this calcified cartilage indicates
      that this central area was produced by endochondral ossification.</p>
  </div>
  <div class="subcontent-6 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P05.png" alt="Woven bone > <p>Immediately surrounding the calcified cartilage are small areas of woven bone, remnants of the zone of ossification. Because this bone is located in a space previously occupied by cartilage, this bone was formed by endochondral ossification.</p>
">

    <h3 class="slide-title">
      Woven bone > </h3>

    <p>Immediately surrounding the calcified cartilage are small areas of woven bone, remnants of the zone of ossification. Because this bone is located in a space previously occupied by cartilage, this bone was formed by endochondral ossification.</p>
  </div>
  <div class="subcontent-7 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P07.png" alt="New lamellae > <p>Lamellar deposition has begun around the periphery of several spaces, which were created by death of chondrocytes during endochondral ossification. Continued deposition will create osteons, converting this spongy woven bone to the compact bone seen in the center of the image on the right.</p>
">

    <h3 class="slide-title">
      New lamellae > </h3>

    <p>Lamellar deposition has begun around the periphery of several spaces, which were created by death of chondrocytes during endochondral ossification. Continued deposition will create osteons, converting this spongy woven bone to the compact bone seen
      in the center of the image on the right.</p>
  </div>
  <div class="subcontent-8 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P06.png" alt="Osteons <p>Lamellar deposition has begun around the periphery of several spaces, which were created by death of chondrocytes during endochondral ossification. Continued deposition will create osteons, converting this spongy woven bone to the compact bone seen in the center of the image on the right.</p>
">

    <h3 class="slide-title">
      Osteons </h3>

    <p>Lamellar deposition has begun around the periphery of several spaces, which were created by death of chondrocytes during endochondral ossification. Continued deposition will create osteons, converting this spongy woven bone to the compact bone seen
      in the center of the image on the right.</p>
  </div>
  <div class="subcontent-9 subslide" style="background-image: url(https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.jpg);">
    <img src="https://rampages.us/histology/wp-content/uploads/sites/7453/2018/06/T.C.B.R.05.P08.png" alt="Cement lines > <p>Cement lines separate bone deposited at different time periods.</p>
">

    <h3 class="slide-title">
      Cement lines > </h3>

    <p>Cement lines separate bone deposited at different time periods.</p>
  </div>

</div>

/*Downloaded from https://www.codeseek.co/twwoodward/a-pen-by-tom-MXbNKo */
    


/*Downloaded from https://www.codeseek.co/twwoodward/a-pen-by-tom-MXbNKo */
    

Comments