|
|
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有帐号？立即注册
x
使用Div+CSS所费功夫与收入不成正比，利用table可以大大减少工作量。而上市公司的期望目标不同对Div+css的认同和投入要大一些。
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN"><HTMLlang=itdir=ltrxml:lang="it"xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>CSS+JS把持图片展现效果</TITLE><STYLE>BODY{PADDING-RIGHT:0px;PADDING-LEFT:0px;PADDING-BOTTOM:0px;MARGIN:0px;FONT:70%Verdana,Geneva,Arial,Helvetica,sans-serif;COLOR:#000;PADDING-TOP:0px;TEXT-ALIGN:center}#outer{PADDING-RIGHT:0px;PADDING-LEFT:0px;BACKGROUND:url(/images/bg-outer.gif)repeat-ycentertop;PADDING-BOTTOM:0px;MARGIN:0pxauto;WIDTH:780px;PADDING-TOP:0px;TEXT-ALIGN:left}#wrapper{BACKGROUND:#fff;MARGIN:0px4px}#content{PADDING-RIGHT:0px;PADDING-LEFT:0px;MIN-HEIGHT:400px;PADDING-BOTTOM:20px;MARGIN:20px30px;PADDING-TOP:0px;POSITION:relative}#focus{BORDER-RIGHT:#ccc2pxsolid;PADDING-RIGHT:0px;BORDER-TOP:#ccc2pxsolid;PADDING-LEFT:0px;MIN-HEIGHT:188px;BACKGROUND:url(/images/tile.gif)#eeerepeat-ylefttop;PADDING-BOTTOM:10px;MARGIN:25px0px30px;BORDER-LEFT:#ccc2pxsolid;WIDTH:100%;PADDING-TOP:15px;BORDER-BOTTOM:#ccc2pxsolid;POSITION:relative;HEIGHT:188px}#beni{PADDING-RIGHT:0px;PADDING-LEFT:0px;LEFT:0px;PADDING-BOTTOM:0px;MARGIN:0px;WIDTH:250px;PADDING-TOP:0px;LIST-STYLE-TYPE:none;POSITION:absolute;TOP:15px}#beniLI{BORDER-TOP:#fff1pxsolid;FONT-SIZE:12px;FLOAT:left;WIDTH:250px;TEXT-INDENT:24px;LINE-HEIGHT:26px}#beniLI.first{BORDER-TOP:0px}#beniLIA{BORDER-RIGHT:0px;PADDING-RIGHT:0px;BORDER-TOP:0px;DISPLAY:block;PADDING-LEFT:0px;FONT-WEIGHT:bold;BACKGROUND:#eee;PADDING-BOTTOM:0px;MARGIN:0px;BORDER-LEFT:0px;PADDING-TOP:0px;BORDER-BOTTOM:0px;TEXT-DECORATION:none}#beniLIA:hover{BACKGROUND:#f9f9f9}</STYLE><SCRIPTtype="text/javascript">functionaddLoadEvent(func){varoldonload=window.onload;if(typeofwindow.onload!=function){window.onload=func;}else{window.onload=function(){oldonload();func();}}}functioninsertAfter(newelement,existingelement){varparentelement=existingelement.parentNode;if(parentelement.lastChild==existingelement){returnparentelement.appendChild(newelement);}else{returnparentelement.insertBefore(newelement,existingelement.nextSibling);}}functionmakeSlideshow(details,coords,linkholder){if(!document.getElementById)returnfalse;if(!document.getElementById(linkholder))returnfalse;varpane=document.createElement(div);pane.style.width=details[width];pane.style.height=details[height];pane.style.overflow=hidden;//pane.className=descrizione;pane.style.position=relative;pane.style.top=0px;pane.style.left=270px;pane.setAttribute(id,descrizione);varpic=document.createElement(img);pic.setAttribute(id,details[id]);pic.setAttribute(src,details[image]);pic.setAttribute(alt,);pic.style.position=absolute;pane.appendChild(pic);varl_beni=document.getElementById(linkholder);l_beni.parentNode.insertBefore(pane,l_beni);varlnks=l_beni.getElementsByTagName(a);for(vari=0;i<lnks.length;i++){varlinktext=lnks.childNodes[0].nodeValue;if(coords[linktext]){lnks.elementId=details[id];lnks.x=coords[linktext][0];lnks.y=coords[linktext][1];lnks.sliding=null;lnks.onmou搜索引擎优化ver=function(){slideElement(this.elementId,this.x,this.y,6);}lnks.onfocus=lnks.onmou搜索引擎优化ver;}}}functionslideElement(elementId,x,y,inc){if(!document.getElementById)returnfalse;if(!document.getElementById(elementId))returnfalse;varelement=document.getElementById(elementId);if(element.sliding)clearTimeout(element.sliding);if(!element.xpos)element.xpos=0;if(!element.ypos)element.ypos=0;if(element.xpos==x&&element.ypos==y)returntrue;if(element.xpos>x){vardist=Math.ceil((element.xpos-x)/inc);element.xpos=element.xpos-dist;}if(element.xpos<x){vardist=Math.ceil((x-element.xpos)/inc);element.xpos=element.xpos+dist;}if(element.ypos>y){vardist=Math.ceil((element.ypos-y)/inc);element.ypos=element.ypos-dist;}if(element.ypos<y){vardist=Math.ceil((y-element.ypos)/inc);element.ypos=element.ypos+dist;}element.style.left=element.xpos+px;element.style.top=element.ypos+px;element.sliding=setTimeout(slideElement("+elementId+",+x+,+y+,+inc+),10);}/*FocusBeni*/addLoadEvent(showbeni);functionshowbeni(){if(!document.getElementById)returnfalse;if(!document.getElementById(beni))returnfalse;varpanel_details=newArray();panel_details[id]=pic;panel_details[image]=/uploadfile/200806/18/B394852212.jpg;panel_details[width]=420px;panel_details[height]=188px;varcoords=newArray();coords[default]=newArray(0,0);coords[Opereeoggettidarte]=newArray(0,-188);coords[Architetture]=newArray(0,-376);coords[Repertiarcheologici]=newArray(0,-564);coords[Stampeematricidiincisione]=newArray(0,-752);coords[Fotografie]=newArray(0,-940);coords[Benietnoantropologici]=newArray(0,-1128);varlinkholder=beni;makeSlideshow(panel_details,coords,linkholder);}</SCRIPT></HEAD><BODYid=home><DIVid=outer><DIVid=wrapper><DIVid=content><DIVid=focus><ULid=beni><LIclass=first><Ahref="#">Opereeoggettidarte</A></LI><LI><Ahref="#">Architetture</A></LI><LI><Ahref="#">Repertiarcheologici</A></LI><LI><Ahref="#">Stampeematricidiincisione</A></LI><LI><Ahref="#">Fotografie</A></LI><LI><Ahref="#">Benietnoantropologici</A></LI></UL></DIV></DIV></DIV></DIV></BODY></HTML>
尺度之路www.ckuyun.com提醒：能够先修正部分代码后再运转
当然从外界的各种渠道中，特别是互联网上，我们了解到现在市面上的公司并不关心网页是如何生成的，他们需要的是快速、高效的工作和花哨的页面。 |
|
|Archiver|手机版|仓酷云
鄂ICP备14007578号-2
发表于 2015-1-16 10:37:29
收藏
转播
分享
淘帖
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜