さまざまな RSS フィードからの投稿を多数の div (スライド) に配置するカルーセルを作成しています。一度に 1 つのスライドが表示され、animate() を使用してスライドを適切な方向に移動する左右のボタンがあります。現在、10 枚のスライド (0 から 9 までの番号) を表示しています。空白が表示されないようにするために、スライド 9 が表示されているときに左ボタンが機能しないようにし、スライド 0 が表示されているときに右ボタンが機能しないようにしたいと考えています。これまでのところすべてが機能していますが、jquery スクリプトで現在のスライドを追跡する方法が見つかりません。これが私がこれまでに持っているものです: これは、私のワードプレス サイトのセクションに含まれているスクリプトです。ID #1 はカルーセル #1 を参照します。#left と #right はボタンを表します。
$(document).ready(function(){
$("#1").data("slide_num",0);
$("#1 #left").click(function(){
if($("#1").data("slide_num") < 9){
$("#1 .item").animate({left: "-=800px"}, 250);
$("#1").html(function(){
var $this = $(this);
var $slide_num = $this.data("slide_num") + 1;
$this.data("slide_num",$slide_num);
});
});
});
$("#1 #right").click(function(){
if($("#1").data("slide_num") > 0){
$("#1 .item").animate({left: "+=800px"}, 250);
$("#1").html(function(){
var $this = $(this);
var $slide_num = $this.data("slide_num") - 1;
$this.data("slide_num",$slide_num);
});
});
});
});
私は何を間違っていますか?サーバー側で変数を保存して追跡する必要がありますか? .data() メソッドの代わりに、slide_num という名前の変数を使用してみましたが、それも機能しませんでした。これについて何か助けていただければ幸いです。