twitter bootstrap轮播控制的问题?

时间:2014-08-15 21:16:40

标签: java twitter-bootstrap jsp scriptlet

我要做的是通过连接到数据库,从该数据库拍摄照片并使用这些图像填​​充轮播,在Twitter Bootstrap Carousel控件中动态创建幻灯片。出于某种原因,我正在处理的旋转木马不会滑动。我的代码出了什么问题?

<div id="myCarousel" class="carousel slide" data-interval="false">
    <!-- Carousel items -->
    <div class="carousel-inner">
        <%
            rs = stmt.executeQuery("SELECT IMG_NAME FROM IMAGES WHERE IMG_NAME LIKE 'Material%'");

            ResultSetMetaData rsmd = rs.getMetaData();

            while (rs.next()) {
                names.add(rs.getString(1));
            }

            double testDouble = names.size() / 3;
            int divider = names.size() / 3;

            if (testDouble > divider) {
                divider++;

            }

            int totalSpaces = divider * 3;
            int lastBit = totalSpaces % names.size();

            for (int j = 0; j < divider + 0; j++) {
                List<String> content = new ArrayList<String>();
                if (names.size() >= 3) {
                %>
                    <div class="active item">
                <%

                for (int x = 0; x < 3; x++) {
                    content.add(names.get(x));
                    String theUrl_2 = "http://localhost:8085/assignment/GetImage?name=" + content.get(x);                                           
                %>

                <a href="<%=theUrl_2%>">                                        
                    <div class="thumbnail">
                        <div class="caption">
                            <h4>3</h4>
                        </div>
                        <img src="<%=theUrl_2%>" alt="ALT NAME">
                        <div class="caption-btm">
                            <p>kjlkj</p>
                        </div>
                    </div>
                </a>

                <%
                }
                names.remove(2);
                names.remove(1);
                names.remove(0);
                %>

    </div>

                <%
                } else {
                %>
                <div class="item">
                <%
                    for (int i = 0; i < lastBit; i++) {

                        content.add(names.get(i));
                        String theUrl = "http://localhost:8085/assignment/GetImage?name=" + content.get(i);
                %>

                    <a href="<%=theUrl%>">
                        <div class="thumbnail">
                            <div class="caption">
                                <h4>1</h4>
                            </div>
                            <img src="<%=theUrl%>" alt="ALT NAME">
                            <div class="caption-btm">
                                <p>test</p>
                            </div>
                        </div>
                    </a>

                <%
                }
                %>

                </div>

                <%
                }
            }
        %>
</div>

1 个答案:

答案 0 :(得分:0)

我发生了什么事情,以便将可能的每一组三张照片设置为“活动项目”,或者首先出现在旋转木马上的三张图片。结果,旋转木马无法移动,因为技术上每组三张照片都是第一张。我使用if语句来测试前三张图片是否实际上是前三张图片,并将它们称为“活动项目”,而其他每张图片都作为默认设置添加,稍后会出现。

编辑:

我用过

if (names.size() >= 3 && j == 0) //j indicates which iteration we are on, j==0 is the first, j==1 is the second, etc.

而不仅仅是

if (names.size() >=3)