Я новичок здесь и очень благодарен за всю помощь, которую я вижу в этом онлайн-сообществе.
Мой вопрос о круговой опции в jCarousel и о проблеме, с которой я столкнулся. У меня есть сайт, который я начинаю создавать, и у меня есть пример проблемы на одной из страниц. На данный момент сайт очень пустой, но пример тому есть.
Теперь для кода -
HTML:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Howard Ray Davis - jCarousel practice</title>
<script src="../assets/js/jquery.js" type="text/javascript"></script>
<script src="../assets/js/jcarousel.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$(".slider").jCarouselLite({
visible: 1,
auto: 1000,
speed: 1000,
scroll: 1
});
});
</script>
<link href="../hrd.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="aa" style="text-align=: center;">
<h1>jCarousel Practice</h1>
</div>
<div id="ba">
<div id="bb">
<div id="bc">
<div class="slider">
<ul>
<li class="fl"><div style="width: 800px;height: 300px;background-color: #F00;"></div></li>
<li class="fl"><div style="width: 800px;height: 300px;background-color: #666;"></div></li>
<li class="fl"><div style="width: 800px;height: 300px;background-color: #0FF;"></div></li>
<li class="fl"><div style="width: 800px;height: 300px;background-color: #C09;"></div></li>
</ul>
</div>
</div>
</div>
</div>
<div id="ya"></div>
<div id="za">
</div>
</body>
</html>
CSS:
@charset "utf-8";
* {
margin: 0px;
padding: 0px;
}
html {
height: 100%;
}
body {
position: relative;
height: 100%;
}
#aa {
width: 100%;
height: 60px;
background-color: #333;
color: #FFF;
text-align: center;
}
#ba {
width: 100%;
}
#bb {
width: 1000px;
margin: auto;
}
#bc {
width: 800px;
margin: auto;
overflow: hidden;
}
#ya {
width: 100%;
height: 40px;
margin-top: 10px;
}
#za {
width: 100%;
height: 40px;
position: absolute;
bottom: 0px;
background-color: #333;
}
Любая помощь в решении этой проблемы будет принята с благодарностью!