A Pen by Chelly

Thumbnail
This awesome code was written by chelly182, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright chelly182 ©
  • HTML
  • CSS
  • JavaScript
    <select id="menu">
  <option value="home">Home</option>
  <option value="about">About</option>
  <option value="Photos">Photos</option>
  <option value="Contact">Contact</option>
</select>
<ul>
  <li id="home">
    <h2>Home</h2>
    <p>Dreamcatcher succulents XOXO shabby chic twee hot chicken wolf four loko semiotics, beard man bun lomo.</p>
  </li>
  <li id="About">
    <h2>About</h2>
    <p>Dreamcatcher succulents XOXO shabby chic twee hot chicken wolf four loko semiotics, beard man bun lomo.</p>
  </li>
  <li id="photos">
    <h2>Photos</h2>
    <p>Dreamcatcher succulents XOXO shabby chic twee hot chicken wolf four loko semiotics, beard man bun lomo.</p>
  </li>
  <li id="contact">
    <h2>Contact</h2>
    <p>Dreamcatcher succulents XOXO shabby chic twee hot chicken wolf four loko semiotics, beard man bun lomo.</p>
  </li>
</ul>

/*Downloaded from https://www.codeseek.co/chelly182/a-pen-by-chelly-zzYZJJ */
    


/*Downloaded from https://www.codeseek.co/chelly182/a-pen-by-chelly-zzYZJJ */
    $('#menu').on('change', function(){
  var value = $(this).val();
  $('li p').slideUp();
  var el = $('#' + value + 'p');
  el.slideDown();
  
  var props = {
    'font-size' : '2em'
  }
  
  e.css(props);
})

Comments