网页制作 显示文件夹中的所有图片
我正在做网站，想要实现下列功能：往文件夹中添加图片后，打开网页，随即显示新图片。打开一个网页，显示文件夹中无数副图片的缩略图。单机缩略图，打开另一个网页，上有下一张等按钮...
我正在做网站，想要实现下列功能：
往文件夹中添加图片后，打开网页，随即显示新图片。
打开一个网页，显示文件夹中无数副图片的缩略图。
单机缩略图，打开另一个网页，上有下一张等按钮。图片为全显示，不限制大小。
这些图片来自与此网页平行的文件夹中。
asp/jip/php/js脚本不限，必须有未加密的原始代码，而且能用。
谢绝推荐相册系统。
是在后台直接往文件夹中添加图片
jip应为jsp
lzxgh621@lzxgh621.cn 展开
往文件夹中添加图片后，打开网页，随即显示新图片。
打开一个网页，显示文件夹中无数副图片的缩略图。
单机缩略图，打开另一个网页，上有下一张等按钮。图片为全显示，不限制大小。
这些图片来自与此网页平行的文件夹中。
asp/jip/php/js脚本不限，必须有未加密的原始代码，而且能用。
谢绝推荐相册系统。
是在后台直接往文件夹中添加图片
jip应为jsp
lzxgh621@lzxgh621.cn 展开
6个回答
展开全部
基本已经实现（我的意见是这种问题最后是不应该放在JSP里实现的，不过你要求我就改成jsp的了，需要的话我把servlet发上来），有什么问题的话，可以给我留言：
<%@ page language="java" import="java.io.File,java.io.FileFilter" pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language='javascript' type='text/javascript'>
<!--
var timeOut;
function view(pic)
{
var bigImgDiv=document.getElementById('showBigImg');
bigImgDiv.className='view';
bigImgDiv.style.display='block';
bigImgDiv.onmouseout=delay;
bigImgDiv.onmouseover=cle;
bigImgDiv.innerHTML="<img width=600px height=600px src='"+pic.src+"'/>";
}
function hidden()
{
document.getElementById('showBigImg').style.display='none';
}
function delay()
{
timeOut=setTimeout('hidden()',2000);
}
function cle()
{
alert('clear');
clearTimeout(timeOut);
}
//-->
</script>
<style type='text/css'>
<!--
.view {
position: absolute;
left: 200px;
top: 150px;
}
//
-->
</style>
</head>
<body>
<div id="showBigImg"></div>
<%!private String getARow(File[] pics, int beginIndex, int rowCount) {
StringBuffer buffer = new StringBuffer();
buffer.append("<tr>");
for (int count = 0; count < rowCount && beginIndex < pics.length; count++) {
//这里的pic/“+pics[beginIndex.getName()中pic为和当前jsp在同一个目录下的图片文件夹，根据你的项目自己改一下
buffer.append("<td><img onmouseout='delay()' onmouseover='view(this)' src='pic/"
+ pics[beginIndex].getName()
+ "' width='60px',height='60px'/></td>");
beginIndex++;
}
buffer.append("</tr>");
return buffer.toString();
}
private String toHtml(File[] pics,int rowCount)
{
StringBuffer buffer=new StringBuffer();
if(rowCount>0)
{
buffer.append("<table>");
for(int beginIndex=0;beginIndex<pics.length;beginIndex+=rowCount)
{
buffer.append(getARow(pics, beginIndex, rowCount));
}
buffer.append("</table>");
}
else
{
}
return buffer.toString();
}
public String haha() {
// file directory
//这个目录也改一下，可以设为绝对路径
File contentDirectory = new File("../webapps/XFireDemo/pic");
File[] allFile = contentDirectory.listFiles(new FileFilter() {
// pictrues you want to show
//你要显示的图片文件的后缀，根据你的实际情况改一下
String[] suffix = { "gif", "jpg", "bmp" };
public boolean accept(File arg) {
for (String aSuffix : suffix) {
if (arg.getName().toLowerCase().endsWith(
aSuffix.toLowerCase()))
return true;
}
return false;
}
});
try{
if(allFile==null||allFile.length<1)return contentDirectory.getCanonicalPath();
}
catch(Exception e)
{
e.printStackTrace();
}
return toHtml(allFile, 3);
} %>
<%=haha()%>
</body>
</html>
<%@ page language="java" import="java.io.File,java.io.FileFilter" pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language='javascript' type='text/javascript'>
<!--
var timeOut;
function view(pic)
{
var bigImgDiv=document.getElementById('showBigImg');
bigImgDiv.className='view';
bigImgDiv.style.display='block';
bigImgDiv.onmouseout=delay;
bigImgDiv.onmouseover=cle;
bigImgDiv.innerHTML="<img width=600px height=600px src='"+pic.src+"'/>";
}
function hidden()
{
document.getElementById('showBigImg').style.display='none';
}
function delay()
{
timeOut=setTimeout('hidden()',2000);
}
function cle()
{
alert('clear');
clearTimeout(timeOut);
}
//-->
</script>
<style type='text/css'>
<!--
.view {
position: absolute;
left: 200px;
top: 150px;
}
//
-->
</style>
</head>
<body>
<div id="showBigImg"></div>
<%!private String getARow(File[] pics, int beginIndex, int rowCount) {
StringBuffer buffer = new StringBuffer();
buffer.append("<tr>");
for (int count = 0; count < rowCount && beginIndex < pics.length; count++) {
//这里的pic/“+pics[beginIndex.getName()中pic为和当前jsp在同一个目录下的图片文件夹，根据你的项目自己改一下
buffer.append("<td><img onmouseout='delay()' onmouseover='view(this)' src='pic/"
+ pics[beginIndex].getName()
+ "' width='60px',height='60px'/></td>");
beginIndex++;
}
buffer.append("</tr>");
return buffer.toString();
}
private String toHtml(File[] pics,int rowCount)
{
StringBuffer buffer=new StringBuffer();
if(rowCount>0)
{
buffer.append("<table>");
for(int beginIndex=0;beginIndex<pics.length;beginIndex+=rowCount)
{
buffer.append(getARow(pics, beginIndex, rowCount));
}
buffer.append("</table>");
}
else
{
}
return buffer.toString();
}
public String haha() {
// file directory
//这个目录也改一下，可以设为绝对路径
File contentDirectory = new File("../webapps/XFireDemo/pic");
File[] allFile = contentDirectory.listFiles(new FileFilter() {
// pictrues you want to show
//你要显示的图片文件的后缀，根据你的实际情况改一下
String[] suffix = { "gif", "jpg", "bmp" };
public boolean accept(File arg) {
for (String aSuffix : suffix) {
if (arg.getName().toLowerCase().endsWith(
aSuffix.toLowerCase()))
return true;
}
return false;
}
});
try{
if(allFile==null||allFile.length<1)return contentDirectory.getCanonicalPath();
}
catch(Exception e)
{
e.printStackTrace();
}
return toHtml(allFile, 3);
} %>
<%=haha()%>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
2018-06-28 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
操作方法：
1、打开我的电脑，点搜索。
2、点其他搜索选项。
3、选择图片、音乐或者视频。
4、点更多高级选项，选择搜索的盘符。
5、点搜索，等待搜索完毕即可。
1、打开我的电脑，点搜索。
2、点其他搜索选项。
3、选择图片、音乐或者视频。
4、点更多高级选项，选择搜索的盘符。
5、点搜索，等待搜索完毕即可。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
相当简单,用PHP的文件函数中的opendir和readdir函数即可,至于后台嘛用个file类型的form上传代码即可,不过时间太晚了,写着也简单,改天有空再看
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
要满足你的这些条件很花时间,就为150分我觉得划不来.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你自己到百度上找啊 好多模块的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
