Edit in JSFiddle

<div id="slides">
  <div class="slide">
    <h2>Lorem Ipsum </h2> 
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vulputate, lorem nec rhoncus egestas, sapien leo fringilla lacus, in eleifend justo magna eget dui.</p> 
          <ul> 
<li>Maecenas varius diam quis turpis egestas molestie. Sed ultrices venenatis leo, at laoreet nibh volutpat a. Curabitur porttitor rutrum magna, sed condimentum turpis rhoncus imperdiet.</li>
<li>Quisque sem ante, facilisis et laoreet a, convallis et arcu. Ut quis lectus eget quam blandit varius.</li>

          </ul>
  </div>
  <div class="slide">
      <h2>Slide 2</h2>
<code class="language-javascript">
// Define our Function
function checkMeaningOfLife ( decimal, success ) {
    if ( parseInt(decimal,10) === 42 ) {
        window.console.log(success);
    }
};
// Define our Variables
var str = 'The meaning of life is true',
    decimal = 42.00;
// Fire our Function
checkMeaningOfLife(decimal,success);
</code>
  </div>
  <div class="slide">
    <h2>Lorem Ipsum </h2> 
          <p>Ut non lorem mi. Nunc auctor, ante vel blandit scelerisque, risus enim dictum nisl, ullamcorper fringilla quam eros vel mi.</p> 
          <ul> 
<li>Maecenas varius diam quis turpis egestas molestie. Sed ultrices venenatis leo, at laoreet nibh volutpat a. Curabitur porttitor rutrum magna, sed condimentum turpis rhoncus imperdiet.</li>
<li>Fusce sed odio in mi dapibus lacinia. Suspendisse mi elit, ullamcorper ac convallis et, pulvinar at elit.</li>

          </ul>
  </div>
</div>

<script src="http://www.viget.com/uploads/file/jquery-presentation/scripts/jquery.presentation.js"></script>

<script src="http://github.com/balupton/jquery-syntaxhighlighter/raw/master/scripts/jquery.syntaxhighlighter.min.js"></script>

<script>$.SyntaxHighlighter.init();</script>
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, .btn 
{ margin: 0; padding: 0; border: 0; font-size: 100%; font-family: inherit; vertical-align: baseline }
a img, frameset { border: 0; }
table {    border-collapse: collapse; border-spacing: 0; }
caption, th, td { text-align: left;    font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q {    quotes: "" ""; }

.hide { display: none; }
.contain-overflow { overflow: hidden; }
.screen-reader { display: block; left: -9999px; position: absolute; top: -9999px; }
.row:after, .clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.amp { font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif; font-size: 1.1em; font-style: italic; font-weight: normal; }

body {
  background: #1a1f1e url(../images/structure/bg-body.png);
  color: #e3dfba;
    font: 16px Helvetica, Arial, Sans-Serif;
}

    h1, h2, h3, h4, h5, h6 { font-weight: normal; }
    h1 { font-size: 16px; line-height: 16px; }
    h2, h3, h4, h5 { font-family: Georgia, "Times New Roman", Times, serif; }
    h2 { color: #6cbdb5; font-size: 24px; line-height: 24px; padding-bottom: 5px; }

    a, a:link { text-decoration: underline; }
    a:visited {}
    a:hover { text-decoration: none; }
    a:active {}

    p, ol, ul, table { margin: 0 0 16px; }
    ul { list-style: square; }
    li { padding: 10px 0; }
    li:first-child { padding-top: 0; }
    li:last-child { border-bottom: none; padding-bottom: 0; }

    code {background-color: white;}
    code li { padding: 0px 0; }

    #header, #footer {
      background: rgba(147,204,198,0.5);
      color: #fff;
      font-size: 16px; 
      line-height: 16px;
      position: fixed;
      width: 100%;
      z-index: 10;
    }
    #header { top: 0; }
    #footer { bottom: 0; text-align: right; }
    #header .container, #footer .container { padding: 20px; }

    button { 
        cursor: pointer; 
        width: auto;
        overflow: visible;
    }
    label { font-weight: bold; }

  #slides { top: 50px; }
  .slide { padding: 40px; }
  .js .slide { position: absolute; }

  .nav-pager, .nav-prev-next { font-size: 16px; line-height: 14px; list-style: none; margin: 0; overflow: hidden; position: fixed; z-index: 100; }
  .nav-pager li, .nav-prev-next li { border: none; float: left; padding: 0; }
  .nav-pager a, .nav-prev-next a { display: block; line-height: 16px; }
  .nav-pager { bottom: 0; left: 20px; }
  .nav-pager li { margin-right: 10px; }
  .nav-pager a, .nav-prev-next a { background: #93ccc6; color: rgba(26,31,30,0.5); padding: 10px 5px; text-decoration: none; }
  .nav-pager .current a, .nav-prev-next a:hover { background: #6cbdb5; color: #fff; }
  .nav-prev-next { right: 20px; top: 0; }
  .nav-prev-next li { margin-left: 10px; }
    
$('#slides').presentation({
  slide: '.slide', //Reference to each individual slide
  pagerClass: 'nav-pager', //Class to put on the unordered list that contains links to each slide
  prevNextClass: 'nav-prev-next', //Class to put on the unordered list that contains the previous and next links
  prevText: 'Previous', //Text for the Previous link
  nextText: 'Next', //Text for the Next link
  transition: 'fade' //Possible values are 'fade', 'show/hide', 'slide'
});