-
Wow. Thanks!
I'm sort of cleaning up someone else's work so I just want to be clear. If I copy and paste the new scripting into the old template making sure the refs to the java and image files are correct (based off your sample page), I should be good to go, right? The previous guy set this up on CMS Made Simple. Thanks again.
-
No, or I'm not sure what you mean. I'll explain what to do.
The demo I set up uses my copy of fadeslideshow.js and my copy of the loading.gif image as configured here:
Code:
. . . ion a:hover, .pagination a.selected{
color: #000;
background-color: #FEE496;
}
#slider1, #slider1 .gallerylayer img {
width: 720px;
height: 331px;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="/uploads/NCleanBlue/js/accord_menu.js"></script>
<script src="/uploads/NCleanBlue/js/jquery.hover_caption.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="http://home.comcast.net/~jscheuer1/side/inmotion/js/fadeslideshow.js">
/***********************************************
* Featured Content Slider- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
<script type="text/javascript">
var $ = jQuery;
fadeSlideShow_descpanel.controls[2][0] = 'http://home.comcast.net/~jscheuer1/side/inmotion/loading.gif';
</script>
</head> <body>
<div id="ncleanblue">
<div id="pagewrapper" class="core-wr . . .
You should grab your own copies (right click and 'Save As'):
http://home.comcast.net/~jscheuer1/s...deslideshow.js
http://home.comcast.net/~jscheuer1/s...on/loading.gif
Put them on the odd-ny.com server and point to them there in the code above.
I also added style which can be seen in the above snippet:
Code:
#slider1, #slider1 .gallerylayer img {
width: 720px;
height: 331px;
}
That's required, don't miss it.
You can and should keep:
Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
It should replace:
Code:
<script type="text/javascript" src="/uploads/NCleanBlue/js/jquery.js"></script>
from the old page.
The scrpt credit in the above should be changed from:
Code:
/***********************************************
* Featured Content Slider- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
to:
Code:
/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
And of course the script near the end of my demo must be added where it is:
Code:
<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "slider1", //ID of blank DIV on page to house Slideshow
dimensions: [720, 331], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: (function(){
var imagearray = [], $t, $a;
$('#slider1 .contentdiv').each(function(){
$t = $(this), $a = $t.find('a');
imagearray.push([$t.find('img').attr('src'), $a.size()? $a.attr('href') : '', $a.size()? $a.attr('target') || '' : '']);
});
return imagearray;
})(),
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
</script>
While the commented script below it can be removed:
Code:
<!-- <script type="text/javascript">
featuredcontentslider.init({
id: "slider1", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
enablefade: [true, 0.1], //[true/false, fadedegree]
autorotate: [true, 3000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script> -->
That should be it. Let me know if you have any problems.
Oh and once you get it set up, let me know because I should take down the demo. You don't want it showing up in search engine results.