27 мая 2010 в 21:44
Дано: 3 дива с текстом (один показан, 2 других скрыты). 2 ссылки-стрелки. Нажали на стрелку "вперед" - показался 2ой див, первый скрылся, еще раз - показался 3й, второй скрылся. Обычная листалка в общем.
Забацал такой скрипт:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
d=1;
$(".page-control").click(function(){
if (d == 1) {
$(“#n2”).show();
$(“#n1”).hide()
d=2;
}
else {
if (d == 2) {
$(“#n3”).show();
$(“#n2”).hide()
d=2;
}
}
else {
if (d == 3) {
$(“#n1”).show();
$(“#n3”).hide()
d=1;
}
}
});
});
</script>
</head>
<script type="text/javascript">
$(document).ready(function(){
d=1;
$(".page-control").click(function(){
if (d == 1) {
$(“#n2”).show();
$(“#n1”).hide()
d=2;
}
else {
if (d == 2) {
$(“#n3”).show();
$(“#n2”).hide()
d=2;
}
}
else {
if (d == 3) {
$(“#n1”).show();
$(“#n3”).hide()
d=1;
}
}
});
});
</script>
</head>
<body>
<a class="page-control" href="#">Next</a>
<div id="n1">раз</div>
<div id="n2">два</div>
<div id="n3">три</div>
</body>
Что-то не работает... Где ошибка?
Комментарии
var d = 1;
$(".page-control").click(function(){
if (d == 1) {
$("#n2").show();
$("#n1").hide()
d = 2;
}
else if (d == 2) {
$("#n3").show();
$("#n2").hide()
d = 3;
}
else if (d == 3) {
$("#n1").show();
$("#n3").hide()
d = 1;
}
});
});
опечатки
Разобрался.
d=1;
$(".btn-slide").click(function(){
if (d == 1) {
$("#n1").animate({ opacity: "hide" }, "slow");
$("#n2").animate({ opacity: "show" }, "slow");
d=2;
}
else if (d == 2) {
$("#n2").animate({ opacity: "hide" }, "slow");
$("#n3").animate({ opacity: "show" }, "slow");
d=3;
}
else if (d == 3) {
$("#n3").animate({ opacity: "hide" }, "slow");
$("#n1").animate({ opacity: "show" }, "slow");
d=1;
}
});
});
xxandeadxx, спасибо! Ваш тоже работает
Stan.Ezersky, ну да, http://code.jquery.com/jquery-1.4.2.min.js. Я ж на тестовой странице проверяю.