📄 index.jsp
字号:
<%@ page contentType="text/html; charset=GBK" language="java" import="java.sql.*" errorPage="" %>
<%@ page import="java.sql.*,java.util.*,javax.servlet.*,
javax.servlet.http.*,java.text.*,com.gd.mvc.util.GdDate,java.math.*,com.myContent.vo.ContentType,com.myContent.vo.Content,com.gd.mvc.io.InfoInAndOut,com.gd.mvc.io.impl.GdInfoInAndOut"
%>
<%! public static final String _AppId = "index"; %>
<%
InfoInAndOut infoOut = (request.getAttribute("infoOut") == null) ? new GdInfoInAndOut() : (InfoInAndOut)request.getAttribute("infoOut");
Map mapContents = infoOut.get("mapContents") == null ? new HashMap(): (HashMap)infoOut.get("mapContents");
List contentTypeList = infoOut.get("contentTypeList") == null ? new ArrayList(): (ArrayList)infoOut.get("contentTypeList");
%>
<html>
<head>
<title>内网首页</title>
<style>
*{font-size:12px}
.style1 {
font-size: x-large;
font-weight: bold;
}
</style>
<!--defer可以让脚本在整个页面装载完成之后再解析，而非边装载边解析。
这对于只包涵事件触发的js脚本而言，可以提高整个页面的加载速度。-->
<script defer>
var draged=false;//表示状态为是否在拖动状态
tdiv=null;
//鼠标按下，开始拖动
function dragStart(){
ao=event.srcElement;//获取鼠标点击事件
if(ao.className!="mainShow") return;//当鼠标点击的不是classname为mainShow的div时，不做任何反应
draged=true;//标识为开始拖动
tdiv=document.createElement("div");//创建一个div
tdiv.innerHTML=ao.outerHTML;//将要拖动的内容付给这个div
//以下为设定这个div的属性
tdiv.style.display="block";
tdiv.style.position="absolute";
tdiv.style.filter="alpha(opacity=70)";//设定为半透明
tdiv.style.cursor="move";
tdiv.style.width=ao.offsetWidth;
tdiv.style.height=ao.offsetHeight;
tdiv.style.top=getPosition(ao).top;//获取点击div的位置
tdiv.style.left=getPosition(ao).left;
document.body.appendChild(tdiv);
lastX=event.clientX;
lastY=event.clientY;
lastLeft=tdiv.style.left;
lastTop=tdiv.style.top;
try{
ao.dragDrop();//使点击的div处于拖动状态
}catch(e){}
}
//开始拖动div
function draging(){
if(!draged)return;//假如不在拖动状态，则返回
var tX=event.clientX;
var tY=event.clientY;
tdiv.style.left=parseInt(lastLeft)+tX-lastX;
tdiv.style.top=parseInt(lastTop)+tY-lastY;//移动后来又创建的div
var rowsDivs=document.getElementsByTagName("div");//获取所有的div
for(var i=0;i<rowsDivs.length;i++){
if(rowsDivs[i].className!="rowsShow")continue;//只对className为rowsShow中的div进行处理，即只对列中的div进行处理
//获取这个div的位置
var parentDiv=getPosition(rowsDivs[i]);
//判断目前鼠标的位置在哪个列中
if(tX>=parentDiv.left&&tX<=parentDiv.right&&tY>=parentDiv.top&&tY<=parentDiv.bottom){
//在其中的一个列中
var mainShows=rowsDivs[i].getElementsByTagName("div");
//如果该列中没有div，即没有栏目
if (mainShows.length ==0 ) {
if(tX>=parentDiv.left&&tX<=parentDiv.right&&tY>=parentDiv.top&&tY<=parentDiv.bottom){
//则将要移动的div添加进这一列
rowsDivs[i].appendChild(ao);
}
break;
}
//如果该列中有栏目
for(var j=0; j<mainShows.length;j++){
//获取每个栏目的位置
var mainShow=getPosition(mainShows[j]);
//如果鼠标在其中的一个栏目中，则将要移动的栏目添加在这个栏目前
if(tX>=mainShow.left&&tX<=mainShow.right&&tY>=mainShow.top&&tY<=mainShow.bottom){
rowsDivs[i].insertBefore(ao,mainShows[j]);
break;
//如果不在，则添加到这个栏目后
}else{
rowsDivs[i].appendChild(ao);
}
}
}
}
}
//拖动结束
function dragEnd(){
if(!draged)return;
draged=false;//状态为拖动结束
mm=rollback(150,15);//恢复位置
}
//取得一个对象的坐标
function getPosition(o){
var to=new Object();//new一个对象
to.left=to.right=to.top=to.bottom=0;//将该对象的位置都置为0
var twidth=o.offsetWidth;
var theight=o.offsetHeight;
while(o!=document.body){//判断是否为body
to.left+=o.offsetLeft;
to.top+=o.offsetTop;
o=o.offsetParent;//一直到获取到相对于屏幕的位置
}
to.right=to.left+twidth;
to.bottom=to.top+theight;
return to;
}
//用于恢复位置
function rollback(aa,ab){
var ac=parseInt(getPosition(tdiv).left);//获取新建div的左坐标
var ad=parseInt(getPosition(tdiv).top);//获取新建div的上坐标
var ae=(ac-getPosition(ao).left)/ab;
var af=(ad-getPosition(ao).top)/ab;
return setInterval(function(){if(ab<1){//直到新建的div消失
clearInterval(mm);
tdiv.removeNode(true);//移除新建div的结点
ao=null;
return
}
ab--;
ac-=ae;
ad-=af;
tdiv.style.left=parseInt(ac)+"px";
tdiv.style.top=parseInt(ad)+"px"
}
,aa/ab)
}
function init(){//将各个栏目的div与上述的3个方法进行绑定
//首先获取网页中所有的div
var mainDivs=document.getElementsByTagName("div");
for(var j=0;j<mainDivs.length;j++){
if(mainDivs[j].className!="mainShow")continue;//只绑定calssname为mainShow的div
mainDivs[j].calssName = "mainShow";
mainDivs[j].attachEvent("onmousedown",dragStart);//绑定鼠标按下事件
mainDivs[j].attachEvent("ondrag",draging);//绑定拖动事件
mainDivs[j].attachEvent("ondragend",dragEnd);//绑定拖动结束事件
}
}
init();
</script>
</head>
<body >
<!-id为gf的div用来定位其他div-->
<div align="center" class="style1" style='float:left;width:100%;height:10%;border: 1px solid #BA5B57;' >
内网首页
</div>
<div id='gf' style='float:left;width:100%;height:100%;border: 1px solid #BA5B57;' >
<%
for (int i = 0; contentTypeList != null && contentTypeList.size() > i; i++) {
ContentType contentType = (ContentType)contentTypeList.get(i);
if (i%2 == 0) {
%>
<!-表示一列，为左边一列-->
<div class="rowsShow" style='float:left;width:33%;height:500;border: 1px solid red;'>
<%}%>
<!-表示一个栏目，为公司新闻栏目-->
<div class="mainShow" style='width:100%;border: 1px solid yellow;'>
<%=contentType.getContentTypeName()%>
<%
List contentList = (List)mapContents.get(contentType.getId());
for (int j = 0; contentList != null && contentList.size() > j; j++) {
Content content = (Content)contentList.get(j);
%>
<!-每个div表示一条新闻-->
<div style='width:100%;border: 1px solid red;'>
<a href="show.htm"><%=content.getTitle()%></a>
</div>
<%}%>
<div style='width:100%;border: 1px solid red;' align='right'>
<a href="showMore.htm">更多内容</a>
</div>
</div>
<%
if (i%2 != 0) {
%>
</div>
<%}}%>
</div>
</div>
<script language="javascript1.2">
window.name = "<%="index_"+session.getId()%>";
</script>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -