logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > Javascript and JS frameworks
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 10-10-2011, 07:05 PM   #1
Kuler
 
Join Date: Jul 2011
Posts: 6
Default JQUERY PROBLEM causing big headache

I have been unable to make a "simple" Jquery Cycle Slideshow work - despite numerous attempts.

I'm using http://line25.com/tutorials/build-a-...h-jquery-cycle but all I ever get are the images in a vertical column and not working as a slider or just a single image showing.

I'd be very grateful if someone could tell me what I'm doing wrong.


The css & html is below with the js available from the link.

Thanks for any advice.

Paul

css

body, h1, ul, li {
margin: 0; padding: 0; border: 0;
}

body {
background: #e8dbcb;
}

#container {
width:980px;
height:auto;
margin:25px auto;
position: relative;
}

h1 {
width: 262px; height: 226px; margin: 0 auto; position: relative; top: 100px;
text-indent: -9999px; z-index: 10;
}

div#slideshow {
width: 958px; height: 450px; padding: 15px 0 0 12px;
background: url(images/border.png);
overflow: scroll; /* Allows the slides to be viewed using scrollbar if Javascript isn't available */
position: relative; z-index: 5;
}
div#slideshow ul#nav {
display: none;
list-style: none;
position: relative; top: 210px; z-index: 15;
}
div#slideshow ul#nav li#prev {
float: left; margin: 0 0 0 40px;
}
div#slideshow ul#nav li#next {
float: right; margin: 0 50px 0 0;
}
div#slideshow ul#nav li a {
display: block; width: 80px; height: 80px; text-indent: -9999px;
}
div#slideshow ul#nav li#prev a {
background: url(images/prev.png);
}
div#slideshow ul#nav li#next a {
background: url(images/next.png);
}

div#slideshow ul#slides {
list-style: none;
}
div#slideshow ul#slides li {
margin: 0 0 20px 0;
}

a {outline: none; }

html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript" src="JQUERYjs/jquery.cycle.all.js"></script>
<script type="text/javascript" src="JQUERYjs/jquery.js"></script>
<script type="text/javascript" src="JQUERYjs/scripts.js"></script>
<link href="CSS/HARLEY.css" rel="stylesheet" type="text/css">

</head>

<body>

<div id="container">

<div id="slideshow">
<ul id="slides">
<li><img src="11.jpg" alt="WEDDING" width="960" height="450" /> </li>
<li><img src="22A.jpg" alt="WEDDING" width="960" height="450" /> </li>
<li><img src="44.jpg" alt="WEDDING" width="960" height="450" /> </li>
<li><img src="77.jpg" alt="WEDDING" width="960" height="450" /> </li>
<li><img src="33A.jpg" alt="WEDDING" width="960" height="450" /> </li>
</ul>
</div>

</div>
</div>
</body>
</html>
Kuler is offline   Reply With Quote
Old 10-11-2011, 02:04 AM   #2
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Put it up somewhere on the web. You have the files already
domedia is offline   Reply With Quote
Old 10-11-2011, 08:26 AM   #3
Kuler
 
Join Date: Jul 2011
Posts: 6
Default Problem Resolved

I had to swap these two lines around to make things work ..... finally.
<script type="text/javascript" src="JQUERYjs/jquery.cycle.all.js"></script>
<script type="text/javascript" src="JQUERYjs/jquery.js"></script>Paul
Kuler is offline   Reply With Quote
Old 10-11-2011, 11:50 AM   #4
gentleone
gentleone's Avatar
 
Join Date: Nov 2009
Location: Rhodes, Greece
Posts: 2,837
Default

Quote:
Originally Posted by Kuler View Post
I had to swap these two lines around to make things work ..... finally.
<script type="text/javascript" src="JQUERYjs/jquery.cycle.all.js"></script>
<script type="text/javascript" src="JQUERYjs/jquery.js"></script>Paul
That's weird... everybody (even jQuery) says to load first the library and then plugins otherwise it won't work
__________________
www.gentlemedia.nl
gentleone is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 10:33 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com