javascript - HTML動的コンテンツのjqueryスライドショーダイアログ

Question

ダイアログにロードできるスライドショーツール（jquery用）を探しています。次または前のボタンをクリックするたびに、データベースからコンテンツをロードします。

ダイアログjquery-uiウィジェットを使用してボタンを追加すると、コンテンツの下に配置されます。そして、クライアントが尋ねた方法であるため、私は彼らに側にいてもらいたいです：

次の js コードを使用すると、ダイアログは次のようになります。

$(function() {
    var x = 1;
    $('#dialog').dialog({buttons:
        {
            Next: function() {
                x++; // Increment counter
                $(this).text(x); // Build dialog based on new value
            },
            Prev: function() {
                x--; // Decrement counter
                $(this).text(x); // Build dialog based on new value
            }
        }
    });
});

<div id="dialog" title="Basic dialog">
  <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

ページの読み込み時にすべてのコンテンツを読み込む方がよいと誰かが私に言いましたが、10000 または 15000 の div があり、それぞれに html コンテンツと画像がある場合はどうなりますか。私の最初の考えは、「ページにそれらのオブジェクトを含めるには時間がかかりすぎて、おそらくユーザーがクリックすることは決してないだろう」であり、それが私が彼に言ったことです。そして彼は私に、「あなたはウェブ開発で成長するので、リクエストを避けたいと思うでしょう」

横に次の前のボタンがあるダイアログを使用する方がよい場合、どのツールを使用できますか?

ページはjqueryを使ってRailsで作成されています

ご意見をお寄せいただきありがとうございます。