jQueryスライドショーに画像固有のテキストを含む別のdivがある

Question

jQuery画像スライダを使って、私が欲しいもの、具体的には、「Appleスタイルの美しいスライドショーギャラリー」（& jQuery）を操作しました。

現在、このスライドショーを画像固有のテキストを含む別のdivにリンクしようとしていますが、各サムネイルをハイパーリンクして各画像に必要なコンテンツをロードすることで、これを実現しました。

理想的には、スライドショーの次と前のコントロールを使用してこれを実現したいと思いますが、成功していない複数のソリューションを試しました。私の現在の試みは画像1と画像2のテキストを読み込みますが、そこから先に立ち往生します。私の試みのためのHTML、CSSおよびJavaScriptがhttp://jsfiddle.net/v9vf9/で見つけることができます

（私のすべてのファイルがローカルに保存された瞬間のためにあるように、結果が正しく表示されません）

私は私が達成しようとしている何をすることを確信しています非常に複雑ではありませんが、私の能力を超えているようですが、私はこれで成功するためのアドバイス、助け、または解決に感謝します!!私の知識を向上させることを楽しみにしています。それは、彼らは画像をアニメーションされるように、アニメーションのスライド内のテキストを入れて少し簡単だ

http://jsfiddle.net/lollero/Sw4y8/

コメントで示唆したよう

は、

Answer 1

ので、事前にカールをありがとう自動的に、そして最も重要なのは、#slides要素に、テキストが収まるようなより大きい高さを与えます。

HTML：

<div class="slide"> 
     <img src="http://placekitten.com/g/500/230" alt="" /> 
     <div class="text">Text</div> 
    </div> 

</div> 

<div id="thumbnails">Thumbnails</div> 

CSS：

#slides { 
    height: 550px; /* or what ever amount is big enough to fit the text there too */ 
    float: left; 
    position: relative; 
    z-index: 5; 
} 

#thumbnails { 
    float: left; 
    clear: both; 
    position: relative; 
    z-index: 10; 
    top: -110px; 
} 

.text { margin-top: 50px; /* for example if you want to give thumbnails room to sit above the text */ }