I'm trying to reproduce the vertical jcarousel example show by the author in this page:
http://sorgalla.com/projects/jcarousel/examples/static_vertical.html
here is my html code:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<link href="skin.css" rel="stylesheet" type="text/css" />
<script src="jquery.jcaro开发者_如何学JAVAusel.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#mycarousel').jcarousel({
vertical: true,
scroll: 2
});
});
</script>
</head>
<body >
<form id="form1" runat="server">
<div class="FinKaynDiv">
<div id="slider">
<ul id="mycarousel" class="jcarousel jcarousel-skin-tango">
<li>Image1</li>
<li>Image2</li>
<li>Image3</li>
<li>Image4</li>
<li>Image5</li>
<li>Image6</li>
</ul>
</div>
</div>
</form>
</body>
</html>
The result nothing,a list of images!!(NB:i have changed the images src="" so that i can ask my question) is there a problem?pls help.
You probably got your answer by now after 3 years :)
Your problem is you should jcarousel the div#slider
. According to jCarousel documentation:
jCarousel expects a very basic HTML markup structure inside your HTML document:
<div class="jcarousel"> <--------------------------------| Root element
<ul> <-------------------------------| List element |
<li>...</li> <---| Item element | |
<li>...</li> <---| Item element | |
</ul> <------------------------------| |
</div> <-------------------------------------------------|
This structure is only an example and not required. You could also use a structure like:
<div class="mycarousel"> <-------------------------------| Root element
<div> <------------------------------| List element |
<p>...</p> <-----| Item element | |
<p>...</p> <-----| Item element | |
</div> <-----------------------------| |
</div> <-------------------------------------------------|
The only requirement is, that it consists of a root element, list element and item elements.
So your script should look like this:
<script type="text/javascript">
$(document).ready(function() {
$('#slider').jcarousel({
vertical: true,
scroll: 2
});
});
</script>
Have you set the css like :
<ul id="mycarousel" class="jcarousel jcarousel-skin-tango">
and referred the script files :
<script type="text/javascript" src="/lib/jquery.jcarousel.min.js"></script>
<!--
jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="/skins/tango/skin.css" />
Dont you need to load JQuery?
<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
精彩评论