📄 imagelist.ascx
字号:
Display="Dynamic"></asp:RequiredFieldValidator>
</DIV>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="30%" nowrap><asp:Literal Runat="server" ID="Pager"></asp:Literal>
</td>
<td colspan="2" align="right" nowrap><asp:Button Runat="server" ID="refresh" CssClass="btn3_mouseout" Text="刷新" ToolTip="您可以通过FTP上传到图片文件夹,点击刷新即可看到文件"></asp:Button>
<input name="" id="opt" onclick="toShowCreateDir()" style="WIDTH:55px" type="button" value="新建目录"
class="btn3_mouseout" onMouseOver="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'">
<input name="" onclick="toSelect(this,'all')" style="WIDTH:30px" type="button" value="全选"
class="btn3_mouseout" onMouseOver="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'">
<input onclick="toSelect(this,'over')" style="WIDTH:30px" name="" type="button" value="反选"
class="btn3_mouseout" onMouseOver="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'">
<input name="" onclick="toDelete(this)" style="WIDTH:60px" type="button" value="删除图片" title="删除选中的图片"
class="btn3_mouseout" onMouseOver="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'">
</td>
<td> <asp:DropDownList ID="dirs" Runat="server"></asp:DropDownList>
</td>
</tr>
<tr>
<td colspan="4"><table width="100%" border="0">
<tr>
<td width="70%" class="ImgPage">路径：
<asp:Literal Runat="server" ID="location"></asp:Literal></td>
<td width="120" align="right" class="ImgPage">图片显示顺序：</td>
<td width="150" align="right" class="ImgPage">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="" title="文件大小" id="size" runat="server">大小</a></td>
<td><a href="" title="上传时间" id="date" runat="server">时间</a></td>
<td><a href="" title="文件名称" id="path" runat="server">名称</a></td>
<td><a href="" title="图片尺寸" id="width" runat="server">尺寸</a></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="95%" height="370" valign="top"><div id="showArea" style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 100%">
<ul class="imageList">
<asp:Repeater Runat="server" ID="FolderList">
<ItemTemplate>
<li>
<div class="imagespacer imageListDiv">
<table border="0" width="110" height="120" cellspacing="0" cellpadding="0">
<tr>
<td class="ImagesManage_Border" align="center" valign="middle" height="60"><a href="#1" title="点击进入" onmousedown="goToFolder('<%#Container.DataItem%>')" class="ManagePic" style="width:100px;height:100px;padding-top:30px;">
<img src="<%#GetImgUrl(Container.DataItem)%>" align="middle" vspace="middle" border="0"id="Img1" class="ManagePic" />
</a>
</td>
</tr>
<tr>
<td><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="center"><%#GetName(Container.DataItem)%></td>
</tr>
<tr>
<td align="center"><%#GetDeleteButton(Container.DataItem)%></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</li>
</ItemTemplate>
</asp:Repeater>
<asp:Repeater Runat="server" ID="DLImageList">
<ItemTemplate>
<li>
<div class="imagespacer imageListDiv" id="list<%#GetID(Container.DataItem)%>1231">
<table border="0" align="center" width="110" height="120" cellspacing="0" cellpadding="0">
<tr>
<td class="ImagesManage_Border" align="center" valign="middle" height="60"><a href="#" target="_blank" class="ManagePic" style="width:100px;height:100px;padding:2 2 0 2;"
runat="server" id="imgSrc"><img src="Images/5.gif" align="middle" vspace="middle" border="0" runat="server" id="img" /> </a>
</td>
</tr>
<tr>
<td><table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="right"><input onclick="ChangeSelected(this)" name="lists" id="list<%#GetID(Container.DataItem)%>" type="checkbox" value="">
</td>
<td nowrap><label for="list<%#GetID(Container.DataItem)%>">
<asp:Literal Runat="server" ID="name"></asp:Literal>
</label></td>
</tr>
</table>
</td>
</tr>
<tr onclick="ChangeSelected(document.getElementById('list<%#GetID(Container.DataItem)%>'),true)" >
<td><table width="100%" cellspacing="0" cellpadding="0">
<!--tr>
<td align="right" width="50">大小:</td>
<td><asp:Literal Runat="server" ID="size"></asp:Literal>
</td>
</tr-->
<tr>
<td align="right">尺寸:</td>
<td>
<asp:Literal Runat="server" ID="width" />
*
<asp:Literal Runat="server" ID="height" /></td>
</tr>
<tr>
<td align="right">时间:</td>
<td>
<asp:Literal Runat="server" ID="joinDate" /></td>
</tr>
<tr>
<td align="right">删除:</td>
<td><a href="" runat="server" id="del"><img alt="删除文件" src="Images/del.gif"></a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td></td>
</tr>
</table>
</div>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
</td>
</tr>
</table>
<div id="selectArea" style="filter: alpha(opacity=30);line-height:0px;display:none;border:1px solid #111;background-Color:#999;width:0px;height:0px;position:absolute;left:0px;top:0px;"><img src="images/tm.gif" /></div>
<script>
if(window.exist != null)
{
//toShowCreateDir();
}
var imageWidth = 110,imageHeight = 120;
var isAreaStart = false;
var selectArea = null;
var selectStartX,selectStartY;
var imgLists = null;
var showArea = null;
var isSelect = true;
var isScroll = false;
if(!showArea)showArea = document.getElementById("showArea");
document.onmousedown = function()
{
if(!selectArea)selectArea = document.getElementById("selectArea");
document.onselectstart = function(){return false;}
if(window.event)
{
selectStartY = document.body.scrollTop + event.y;
selectStartX = document.body.scrollLeft + event.x;
isAreaStart = true;
}
}
//var d = 0;
document.onscroll = function()
{
//d++;
//isScroll = true;
isAreaStart = false;
selectArea.style.display = "none";
}
document.onmouseup = function()
{
isSelect = true;
if(window.event)
{
if(window.event.shiftKey)
{
isSelect = false;
}
}
document.onselectstart = null;
isAreaStart = false;
if(!imgLists)
{
imgLists = imgList.split("/");
for(var i = 0;i < imgLists.length;i++)
{
imgLists[i] = document.getElementById(imgLists[i]);
}
}
sLeft = parseInt(selectArea.style.left) + showArea.scrollLeft;
sTop = parseInt(selectArea.style.top) + showArea.scrollTop;
//alert(document.getElementById("showArea").scrollTop);
sWidth = parseInt(selectArea.style.width);
sHeight = parseInt(selectArea.style.height);
for(var i = 0;i < imgLists.length;i++)
{
checkInSelected(imgLists[i]);
}
//checkInSelected(imgLists[0]);
//checkInSelected(imgLists[0]);
//alert(imgLists[0].tagName);
//imgLists[0].checked = true;
//ChangeSelected1(imgLists[0]);
selectArea.style.display = "none";
selectArea.style.width = "0"
selectArea.style.height = "0"
selectArea.style.left = "0"
selectArea.style.top = "0"
}
var sTop,sLeft,sWidth,sHeight;
function checkInSelected(input)
{
if(!input.div) input.div = document.getElementById(input.id + endStr);
if(!input.div)return;
if(!input.div.sLeft)input.div.sLeft = GetLeft(input.div);
if(!input.div.sTop)input.div.sTop = GetTop(input.div);
if((input.div.sLeft > sLeft && input.div.sLeft < sLeft + sWidth &&
input.div.sTop > sTop && input.div.sTop < sTop + sHeight) ||
(input.div.sLeft < sLeft && (input.div.sLeft + imageWidth > sLeft) &&
(input.div.sTop > sTop && sTop + sHeight > input.div.sTop || sTop > input.div.sTop && sTop < input.div.sTop + imageHeight)) ||
(input.div.sLeft > sLeft && (input.div.sLeft + imageWidth < sLeft + sWidth || (sLeft + sWidth < input.div.sLeft + imageWidth && sLeft + sWidth > input.div.sLeft )) &&
input.div.sTop < sTop && sTop < input.div.sTop + imageHeight)
//input.div.sTop < sTop && input.div.sTop < sTop + sHeight
)//imageHeight imageWidth
{
input.checked = isSelect;
ChangeSelected1(input);
}
}
document.onmousemove = function()
{
if(isAreaStart && event.button == 1)
{
if(!isScroll)
{
selectArea.style.display = "";
isScroll = false;
}
var x,y;
x = event.x + document.body.scrollLeft
y = event.y + document.body.scrollTop
if(selectStartX > x)
{
if(selectStartY > y)
{
selectArea.style.left = x;
selectArea.style.top = y;
selectArea.style.width = selectStartX - x;
selectArea.style.height = selectStartY - y;
}
else
{
selectArea.style.left = x;
selectArea.style.top = selectStartY;
selectArea.style.width = selectStartX - x;
selectArea.style.height = y - selectStartY;
}
}
else
{
if(selectStartY > y)
{
selectArea.style.left = selectStartX;
selectArea.style.top = y;
selectArea.style.width = x - selectStartX;
selectArea.style.height = selectStartY - y;
}
else
{
selectArea.style.left = selectStartX;
selectArea.style.top = selectStartY;
selectArea.style.width = x - selectStartX;
selectArea.style.height = y - selectStartY;
}
}
}
}
</script>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -