0

常に特別オファーを提供している旅行代理店のクライアントがいて、これらの特別オファーをスライドショーの最初のページに掲載したいと考えています。写真はアイフェル塔としましょう。右側のキャプションは、タイトル、価格、おそらく日付、ボタンなどの詳細情報を含むボックスにする必要があります。したがって、これらのオファーは常に変化し、それを管理するのはクライアントです。今問題は、リピーターで機能させたいということです。画像は正しく変化していますが、キャプションは動いていません。データソースの最初の要素に設定され、そのようにスタックします。少し例を試してみたので、ここに投稿します。

public partial class TestPage : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        List<BindRepeater> source = new List<BindRepeater>
            {
                new BindRepeater {Pic = "Images/TestSlideshow/nemo.jpg", Text = "Text 5", OfferID = 1},
                new BindRepeater {Pic = "Images/TestSlideshow/walle.jpg", Text = "Text 2", OfferID = 2},
                new BindRepeater {Pic = "Images/TestSlideshow/up.jpg", Text = "Text 3", OfferID = 3},
                new BindRepeater {Pic = "Images/TestSlideshow/toystory.jpg", Text = "Text 4", OfferID = 4}
            };

        rptPic.DataSource = source;
        rptPic.DataBind();

        rptCaption.DataSource = source;
        rptCaption.DataBind();
    }

}

public class BindRepeater
{
    public int OfferID { get; set; }
    public string Pic { get; set; }
    public string Text { get; set; }
}

と

<div class="slider-wrapper theme-default">
        <div id="slider" class="nivoSlider">
            <asp:Repeater ID="rptPic" runat="server">
                <ItemTemplate>
                    <div>
                        <asp:HiddenField runat="server" ID="OfferID" />
                        <img src='<%# Eval("Pic") %>' alt="" title='<%# String.Format("#htmlDiv{0}",Eval("OfferID")) %>' />
                    </div>
                </ItemTemplate>
            </asp:Repeater>
        </div>
    </div>
    <asp:Repeater runat="server" ID="rptCaption">
        <ItemTemplate>
            <div id='<%# String.Format("htmlDiv{0}",Eval("OfferID")) %>' class="nivo-html-caption">
                <asp:Label runat="server" ID="lbl" Text='<%# Eval("Text") %>' CssClass="label_blue15"></asp:Label>
            </div>
        </ItemTemplate>
    </asp:Repeater>            <script type="text/javascript">
            $(window).load(function () {
                $('#slider').nivoSlider({
                    effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
                    animSpeed: 500, // Slide transition speed
                    pauseTime: 5000, // How long each slide will show
                    startSlide: 0, // Set starting Slide (0 index)
                    directionNav: true, // Next & Prev navigation
                    controlNav: true, // 1,2,3... navigation
                    controlNavThumbs: false, // Use thumbnails for Control Nav
                    pauseOnHover: true, // Stop animation while hovering
                    manualAdvance: false // Force manual transitions
                });
            });
        </script>

htmlcaption div には、ラベルやボタンなど、より多くのものがあります。これはただのダミーでした。この段階では、キャプションはアニメーション化されていません。画像が変更されたときに、適切なOfferIDで必要なテキストをデータソースから取得できるようにしたいと考えています。それとも別のアプローチがあるのでしょうか？画像とキャプションの両方を含む 1 つのリピーターも試しましたが、うまくいきませんでした。

ありがとう

後で編集:コードを変更し、キャプション用のリピーターも作成し、img タイトルをキャプション リピーター内の div の ID に設定しようとしました。私が得たのは、写真がスライドし、キャプションが最初の写真にとどまり、次の写真に変わることはありません.

4

1 に答える 1

1

わかりました、私はなんとか答えを見つけることができました。2つのリピーターでそれを行う方法は上記の方法であり、上のコードの修正は、データソースのOfferIDに値を指定するのを忘れたことです。私もそれを編集し、上記のコードを実行するとよいでしょう。

于 2013-01-11T10:05:54.730 に答える