I'm integrating a Jquery slider within wordpress this is actually the demo from the slider.

I can tell the div that's their but for whatever reason it's not turning up. See the working site here

Now my problem is this fact code:

<script type="text/javascript">
var _siteRoot='index.php',_root='index.php';</script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.js"></script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/scripts.js"></script>

signifies and index.html, however in wordpress I enabled permalinks. Any clue what will be the _siteRoot is?

this is actually the complete code

HEADER

<script type="text/javascript">
var _siteRoot='index.php',_root='index.php';</script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.js"></script>
  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/scripts.js"></script>

Listed here are the pictures:

<div id="slide-holder">
<div id="slide-runner">
    <a href=""><img id="slide-img-1" src="images/nature-photo.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-2" src="images/nature-photo1.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-3" src="images/nature-photo2.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-4" src="images/nature-photo3.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-5" src="images/nature-photo4.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-6" src="images/nature-photo4.png" class="slide" alt="" /></a>
    <a href=""><img id="slide-img-7" src="images/nature-photo6.png" class="slide" alt="" /></a> 
    <div id="slide-controls">
     <p id="slide-client" class="text"><strong>post: </strong><span></span></p>
     <p id="slide-desc" class="text"></p>
     <p id="slide-nav"></p>
    </div>
</div>

    <!--content featured gallery here -->
   </div>

And also the footer

<script type="text/javascript">
    if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1"},{"id":"slide-img-2"},{"id":"slide-img-3"},{"id":"slide-img-4"},{"id":"slide-img-5"},{"id":"slide-img-6"},{"id":"slide-img-7"},{"id":"slide-img-8"}];
   </script>

When you are adhering Wordpress vars / constants in javascript, I've the very best success adding a javascscript in the top my theme's header.php with a few global vars.

Your unique configurations could most likely be achieved with:

var _siteRoot='<?php bloginfo('url'); ?>',
var _root='<?php bloginfo('url'); ?>';