Question

我想在每个滑块上显示4张照片，但我只能获得1张照片

有没有不同的方法在滑块上并排显示4张照片？

 <div class='slider'>
                        <ul class='slides'>
                                <asp:Repeater ID="rpShowcaseAlbum" runat="server">
                                    <ItemTemplate>
                               <li>
                                <!-- Showcase Album -->
                                <div class='span12'>
                                        <a href="album_detay.aspx?ArtistID=<%#Eval("ArtistID") %>">
                                            <div class="photo_frame">
                                                <img src='Admin/uploads/photo/<%#Eval("Photo") %>' style="max-width: 250px; max-height: 250px;" alt='' />
                                                <div class='text'>
                                                    <span class='artist'><%#Eval("ArtistName") %></span>
                                                </div>
                                            </div>
                                        </a>
                                </div>
                            </li>
                            </ItemTemplate>
                            </asp:Repeater>
                       </ul>
                    </div>


  if (Dt.Rows.Count > 0)
        {
            rpShowcaseAlbum.DataSource = Dt;
            rpShowcaseAlbum.DataBind();
        }

Answer 1

您的问题是您正在为滑块中的每个项目创建包装li和div。您可以使用项索引仅在需要时呈现这些li和div：

<%# Container.ItemIndex % 4 == 0 ? "<li><div class='span12'>" : "" %>

    <a href="album_detay.aspx?ArtistID=<%#Eval("ArtistID") %>">
        <div class="photo_frame">
            <img src='Admin/uploads/photo/<%#Eval("Photo") %>' style="max-width: 250px; max-height: 250px;" alt='' />
            <div class='text'>
                <span class='artist'><%#Eval("ArtistName") %></span>
            </div>
        </div>
    </a>

<%# Container.ItemIndex % 4 == 3 ? "</div></li>" : "" %>

这有点trick，因为Container实际上只在数据绑定上下文中可用。

如何在滑块上显示4张照片？

1 个答案: