PDA

View Full Version : Content Slider v.2.4 - Images not loading



kmiddleton
09-05-2010, 03:30 PM
1) Script Title: Featured Content Slider v.2.4

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

3) Describe problem:
Ultra-newbie problem: I can't even get the images to load at all. Only the frame that would enclose the images appears:
http://frank.mtsu.edu/~kmiddlet/history/women/dwh_slider.html

I've contentslider.js and contentslider.css to the same directory, and checked that the directory to access the images is correct.

[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<link rel="stylesheet" type="text/css" href="contentslider.css">

<script type="text/javascript" src="contentslider.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>
</head>

<body>

<br />
<h2>Example 2, Pagination links from markup</h2>

<!--Inner content DIVs should always carry "contentdiv" CSS class-->
<!--Pagination DIV should always carry "paginate-SLIDERID" CSS class-->

<div id="slider2" class="sliderwrapper">

<div class="contentdiv">
<img src="katrina_thomas_wedding_153_107.jpg"
alt="Katrina Thomas Wedding" width="153" height="107" >
<a href="http://triptych.brynmawr.edu/cdm4/wedding.php">Katrina Thomas
Ethnic Wedding Photograph Collection</a> (Bryn Mawr College)
includes more than 800 photographs of ethnic weddings in the United
States.
</div>

<div class="contentdiv">
<img src="marquette_bluegold_153_107.jpg"
alt="Women in Blue & Gold" width="153" height="107"> Content 2 Here. <br
/>
<p></p><a href="javascript:featuredcontentslider.jumpTo('slider2', 1)">Go
back to 1st slide</a></p>
</div>

<div class="contentdiv">
<img src="../../images/anderson_marian_153_107.jpg"
alt="Marian Anderson, 1921" width="153" height="107"> Content 3 Here.
</div>

</div>

<div id="paginate-slider2" class="pagination">

<a href="#" class="toc">1</a> <a href="#" class="toc
anotherclass">2</a> <a href="#" class="toc">3</a> <a
href="#" class="prev" style="margin-left: 10px"><</a> <a href="#"
class="next">></a>

</div>

<script type="text/javascript">

featuredcontentslider.init({
id: "slider2", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or
["ajax", "path_to_file"]
toc: "markup", //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.2], //[true/false, fadedegree]
autorotate: [false, 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>

</body>
</html>

azoomer
09-05-2010, 06:05 PM
Make sure you don't break up the lines in this part:

<script type="text/javascript">

featuredcontentslider.init({
id: "slider2", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "markup", //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.2], //[true/false, fadedegree]
autorotate: [false, 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>

kmiddleton
09-06-2010, 01:56 AM
That did the trick. I should have known to check that.
Many, many thanks for you help!