私が書いている関数は、エンドユーザーがサムネイルをクリックしたときにパネルを下にスライドさせることを目的としています。パネルには、画像、タイトル、説明の拡大版も表示されるという考え方です。
これが私のjQueryです:
$(document).ready(function() {
var $feature = $('#feature')
.wrap('<div id="feature-outer"></div>');
$('.thumb').click(function() {
$feature.blindToggle('slow');
$feature.style.zIndex="-1";
$('#featuretitle').source=this.title;
$('#featureinfo').source=this.info;
$('#featureimage').source=this.image;
});
});
そして、これが私の親指のHTMLです。
<div class=thumb title="title here" info="description here" image="sunset.jpg"></div>
情報が読み込まれる場所は次のとおりです。
<div class=feature id="feature">
<div class=featureimage id="featureimage"></div>
<div class=featureinfo>
<div class=featureinfotitle id="featuretitle">Title</div>
<p id="featureinfo">info</p>
</div>
親指をクリックすると、パネルが下にスライドしますが、ボックス内の情報はデフォルトのままです。