Help! Trouble installing SlideDeck
Permalink
Hi all, I really hope someone can help. I'm trying to install the jQuery slider called SlideDeck and just can't get it to run. All 5 slides are running in one long unformatted slide right down the page.
As the slider will be appearing on most of the pages on the site I've put the scipts into header.php. I've put the two .js files required into the c5 js directory. I've made a "stlesheets" directory in my theme folder and have put the slide deck.skin.css and the 4 image files into it. I'm seeing the pictures so that part seems okay.
Here's the <head> part of the page:
<head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<? Loader::element('header_required'); ?>
<link href="<?=$this->getThemePath()?>/styles.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="<?=$this->getThemePath()?>/stylesheets/slidedeck.skin.css" type="text/css" media="screen">
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/slidedeck.jquery.js"></script>
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/jquery-mousewheel/jquery.mousewheel.min.js"></script>
<style type="text/css">
body {
background-color: #000;
background-image: url(<?=$this->getThemePath()?>/a-images/bg.jpg);
background-repeat: repeat-x;
}
#slidedeck_frame {
width: 901px;
height: 300px;
}
<style type="text/css">
</style>
</head>
As the slider will be appearing on most of the pages on the site I've put the scipts into header.php. I've put the two .js files required into the c5 js directory. I've made a "stlesheets" directory in my theme folder and have put the slide deck.skin.css and the 4 image files into it. I'm seeing the pictures so that part seems okay.
Here's the <head> part of the page:
<head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<? Loader::element('header_required'); ?>
<link href="<?=$this->getThemePath()?>/styles.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="<?=$this->getThemePath()?>/stylesheets/slidedeck.skin.css" type="text/css" media="screen">
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/slidedeck.jquery.js"></script>
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/jquery-mousewheel/jquery.mousewheel.min.js"></script>
<style type="text/css">
body {
background-color: #000;
background-image: url(<?=$this->getThemePath()?>/a-images/bg.jpg);
background-repeat: repeat-x;
}
#slidedeck_frame {
width: 901px;
height: 300px;
}
<style type="text/css">
</style>
</head>
Thanks,
JP.