直接滚动到一个特定的图像

Directly scroll to a particular image

本文关键字：一个 图像 滚动      更新时间：2023-09-26

我提供了用户上传的每个图像的链接，该链接将用户带到滑块以滚动用户在我的网站上上传的所有图像。用户上传的所有图片路径已存储在数据库中。

现在，我想要的是，当用户点击一个特定的图像，滑块直接滚动到该图像和所有其他图像按照各自的位置在数据库中排列，即。，在该特定图像之前上传的将显示在该图像之前，同样，在该图像之后上传的将显示在滑块中的特定图像之后。

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

我还将把我的代码放在下面:

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

这是显示我的图像的页面。字符串变量"lnk6"提供了到滑块的链接。"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"是存储用户上传的所有图片的表。

在你想去的地方放一个锚

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

在你的图片上有一个指向这个锚点的链接

    <a href="#destinaton">

使用JQuery平滑滚动，使其更用户友好:)

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

您需要为放置的每个图像创建单独的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>

请检查代码是否有语法错误，我对这种语言了解不多。

相关文章：