Question

我为用户上传的每张图片提供了一个链接，该图片将用户带到Slider滚动浏览用户在我的网站上上传的所有图片。用户上传的所有图片的路径都是存储在数据库中。

现在，我想要的是当用户点击特定图像时，滑块直接滚动到该图像，所有其他图像根据它们在数据库中各自的位置排列，即在该特定图像之前上传的那些图像是之前显示的和类似的图像显示在滑块中的特定图像之后。

滑块使用<li>标记按顺序列出图像。我该如何执行所需的任务？

我也会在下面提出我的代码：

<%
     String lnk6 = "slider2.jsp?posted_id="+image_id;
 %>
<a href = "<%=lnk6%>" ><img src = "<%=lnk%>" width = "500px" height = "400px" /> </a>

这是我的图片显示的页面。字符串变量“lnk6”提供了到Slider的链接。 “image_id”是一个变量，它在上面的代码中获得（我没有显示），提供特定图像的ID。现在我的代码在Slider中：

int id_show = Integer.parseInt(request.getParameter("image_id"));
PreparedStatement pstmt_show = conn.prepareStatement("select image,text from post where posted_id=?");
pstmt_show.setInt(1, id_show);
ResultSet rst_show = pstmt_show.executeQuery();
while(rst_show.next())
{
    img_show = rst_show.getString(1);
    text_show = rst_show.getString(2);
    if(!(img_show.equals("")))
    {
        link_show = "./postimages/"+img_show;
%>
        <li><img src="<%=link_show%>" title="<%=text_show%>" />            
</li>

<%
    }
}
%>

“post”是存储用户上传的所有图像的表格。

Answer 1

把锚放在你想要去的地方

    <a name='destinaton'></a>

在你的照片上链接到这个锚点

    <a href="#destinaton">

使用JQuery一个流畅的Scroll使其更加用户友好：）

http://plugins.jquery.com/smooth-scroll/

Answer 2

您需要为放置的每张图片创建单独的ID。每个ID都会滚动到该特定图像，因此应该是唯一的。我认为为此定义了一个变量image_id。

代码：

int id_show = Integer.parseInt(request.getParameter("image_id"));
PreparedStatement pstmt_show = conn.prepareStatement("select image,text from post where posted_id=?");
pstmt_show.setInt(1, id_show);
ResultSet rst_show = pstmt_show.executeQuery();
while(rst_show.next())
{
    img_show = rst_show.getString(1);
    text_show = rst_show.getString(2);
    if(!(img_show.equals("")))
    {
        link_show = "./postimages/"+img_show;
%>
        <li><img src="<%=link_show%>" title="<%=text_show%>" id="<%=image_id%>" />            
</li>

<%
    }
}
%>

对于导航部分，

%
   String lnk6 = /*"slider2.jsp?posted_id="+image_id;*/
%>
<a href = "<%=lnk6%>" ><img src = "<%=lnk%>" width = "500px" height = "400px" /> </a>

请检查代码是否有语法错误，我对这种语言知之甚少。

直接滚动到特定图像

2 个答案: