logo
搜索
我的图书馆

发文章

发文工具

其他工具

留言交流
搜索
分享

翻页相册 - 代码综合教程

 昵称2519393 2012-07-27
 

全部代码··更换里面图片地址即可~




 <!-- //学在网络·回归网络 -->

<HTML>
<HEAD>
<TITLE>点击翻页相册</TITLE>
<META http-equiv=Content-Type content="text/html;

charset=gb2312">
<META content="Gerard Ferrandez at" name=Author>
<META http-equiv=imagetoolbar content=no>
<STYLE type=text/css>
BODY {
 PADDING-RIGHT: 0px;
 PADDING-LEFT: 0px;
 BACKGROUND: #111;
 LEFT: 0px;
 PADDING-BOTTOM: 0px;
 MARGIN: 0px;
 OVERFLOW: hidden;
 WIDTH: 500;
 CURSOR: crosshair;
 PADDING-TOP: 0px;
 POSITION: absolute;
 TOP: 0px;
 HEIGHT: 391;
 background-color: #553FAA;
}
.DHTMLBOOK {
 BACKGROUND: #000; LEFT: 0px; WIDTH: 516px; POSITION:

relative; TOP: 0px; HEIGHT: 391px
}
#Layer1 {
 position:absolute;
 width:635px;
 height:365px;
 z-index:1;
 left: 41px;
 top: 415px;
}
body,td,th {
 color: #FFFF00;
}
#Layer2 {
 position:absolute;
 width:200px;
 height:47px;
 z-index:1;
 left: 75px;
 top: 401px;
}
.STYLE3 {
 font-size: 16px;
 font-weight: bold;
 font-family: "黑体";
}
</STYLE>
 
<SCRIPT type=text/javascript><!--
 
window.onerror = new Function("return true");
screen.bufferDepth = 16;
document.onselectstart = function () { return false; }
 
var nI  = 0;
var kI  = 0;
var run = false;
 
function setOpacity(obj,o){
 if(o<0)o=0; else if(o>100)o=100;
 if(obj.filters)obj.filters.alpha.opacity=o;
}
function TPR__(p){
 P1.style.left  = 50-(2.5*p)+"%";
 P1.style.width = (2.5*p)+"%";
 setOpacity(P1i,.5*p*p);
 if(p==20)run = false;
}
function TPR_(p){
 P2.style.width = 50-(2.5*p)+"%";
 setOpacity(P2i,100-.5*(p*p));
 if(p==20){
  P2i.src = IMGSRC[kI].src;
  setOpacity(P2i,100);
  P2.style.width = "50%";
  for(var i=1;i<=20;i++)setTimeout("TPR__("+i+")",i*32);
 }
}
function TPR(){
 if(!run){
  run = true;
  P01i.src = IMGSRC[kI].src;
  P1.style.width = 0;
  kI++;
  if(kI>=nI)kI = 0;
  titLe(kI);
  P02i.src = IMGSRC[kI].src;
  P1i.src  = IMGSRC[kI].src;
  for(var i=1;i<=20;i++)setTimeout("TPR_("+i+")",i*32);
 } else setTimeout("TPR()",100);
}
 
function TPL__(p){
 P2.style.width = (2.5*p)+"%";
 setOpacity(P2i,.5*p*p);
 if(p==20)run = false;
}
function TPL_(p){
 P1.style.left  = (2.5*p)+"%";
 P1.style.width = 40+(10-2.5*p)+"%";
 setOpacity(P1i,100-.5*(p*p));
 if(p==20){
  P1i.src = IMGSRC[kI].src;
  setOpacity(P1i,100);
  P1.style.left  = 0;
  P1.style.width = "50%";
  for(var i=1;i<=20;i++)setTimeout("TPL__("+i+")",i*32);
 }
}
function TPL(){
 if(!run){
  run = true;
  P02i.src = IMGSRC[kI].src;
  P2.style.width = 0;
  kI--;
  if(kI<0)kI = nI-1;
  titLe(kI);
  P01i.src = IMGSRC[kI].src;
  P2i.src  = IMGSRC[kI].src;
  for(var i=1;i<=20;i++)setTimeout("TPL_("+i+")",i*32);
 } else setTimeout("TPL()",100);
}
function titLe(p){
 document.getElementById("TXTBOX").innerHTML = IMGSRC

[p].alt;
}
onload = function() {
 IMGSRC = document.getElementById

("imgsrc").getElementsByTagName("img");
 P01    = document.getElementById

("DHTMLBOOK").getElementsByTagName("span")[0];P01i =

P01.getElementsByTagName("img")[0];
 P02    = document.getElementById

("DHTMLBOOK").getElementsByTagName("span")[1];P02i =

P02.getElementsByTagName("img")[0];
 P1     = document.getElementById

("DHTMLBOOK").getElementsByTagName("span")[2];P1i  =

P1.getElementsByTagName("img")[0];
 P2     = document.getElementById

("DHTMLBOOK").getElementsByTagName("span")[3];P2i  =

P2.getElementsByTagName("img")[0];
 nI     = IMGSRC.length;
 P1i.src = IMGSRC[kI].src;
 P2i.src = IMGSRC[kI].src;
 titLe(kI);
}
//-->
</SCRIPT>
 
<META content="MSHTML 6.00.2900.2873"

name=GENERATOR></HEAD>
<BODY>
<DIV style="LEFT: 0%; POSITION: absolute; TOP: 0%">
<DIV class=DHTMLBOOK id=DHTMLBOOK><SPAN onmousedown="return

false;"
ondblclick=TPL();
style="LEFT: 0px; OVERFLOW: hidden; BORDER-LEFT: #000000

0pt solid; WIDTH: 50%; CURSOR: pointer; POSITION: absolute;

TOP: 0px; HEIGHT: 100%"
onclick=TPL();><IMG
style="LEFT: 0px; WIDTH: 200%; POSITION: absolute; TOP:

0px; HEIGHT: 100%">
</SPAN><SPAN onmousedown="return false;" ondblclick=TPR();
style="BORDER-RIGHT: #000000 0pt solid; LEFT: 50%;

OVERFLOW: hidden; WIDTH: 50%; CURSOR: pointer; POSITION:

absolute; TOP: 0px; HEIGHT: 100%"
onclick=TPR();><IMG
style="LEFT: -100%; WIDTH: 200%; POSITION: absolute; TOP:

0px; HEIGHT: 100%">
</SPAN><SPAN onmousedown="return false;" ondblclick=TPL();
style="BACKGROUND: #000000; LEFT: 0px; OVERFLOW: hidden;

BORDER-LEFT: #000000 0pt solid; WIDTH: 50%; CURSOR:

pointer; POSITION: absolute; TOP: 0px; HEIGHT: 100%"
onclick=TPL();><IMG
style="FILTER: alpha(); LEFT: 0px; WIDTH: 200%; POSITION:

absolute; TOP: 0px; HEIGHT: 100%">
</SPAN><SPAN onmousedown="return false;" ondblclick=TPR();
style="BORDER-RIGHT: #000000 0pt solid; BACKGROUND:

#000000; LEFT: 50%; OVERFLOW: hidden; WIDTH: 50%; CURSOR:

pointer; POSITION: absolute; TOP: 0px; HEIGHT: 100%"
onclick=TPR();><IMG
style="FILTER: alpha(); LEFT: -100%; WIDTH: 200%; POSITION:

absolute; TOP: 0px; HEIGHT: 100%">
</SPAN>
<DIV id=TXTBOX
style="FONT-SIZE: 0.8em; LEFT: 0px; WIDTH: 516px; COLOR:

#aba193; FONT-FAMILY: verdana; POSITION: absolute; TOP:

320px; TEXT-ALIGN: center"></DIV></DIV></DIV>
<DIV id=imgsrc style="VISIBILITY: hidden"><IMG alt=""
src="http://wjwz./images\jiazaitp/1.jpg"> <IMG
 
alt="01"
src="http://wjwz./images\jiazaitp/2.jpg"> <IMG
 
alt="02"
src="http://wjwz./images\jiazaitp/3.jpg"> <IMG
 
alt="03"
src="http://wjwz./images\jiazaitp/4.jpg"> <IMG
 
alt="04"
src="http://wjwz./images\jiazaitp/5.jpg"> <IMG
 
alt="05"
src="http://wjwz./images\jiazaitp/6.jpg"> <IMG
 
alt="06"
src="http://wjwz./images\jiazaitp/7.jpg"> <IMG
 
alt="07"
src="http://wjwz./images\jiazaitp/8.jpg"> <IMG
alt="08"
src="http://wjwz./images\jiazaitp/9.jpg"> <IMG
 
alt="09"
src="http://wjwz./images\jiazaitp/10.jpg"> <IMG
 
alt="10"
src="http://wjwz./images\jiazaitp/11.jpg"> <IMG
 
alt="11"
src="http://wjwz./images\jiazaitp/12.jpg"> <IMG
 
alt="12"
src="http://wjwz./images\jiazaitp/13.jpg"></DIV><SPAN
 
id=LB0 style="LEFT: 250; POSITION: absolute; TOP: 30"><SPAN
style="FONT-SIZE: 10px; LEFT: 50px; COLOR: #ffffff; FONT-

FAMILY: arial; POSITION: absolute; TOP: 30px">图片下载缓冲中

...</SPAN>
<SPAN
style="FONT-SIZE: 0px; BACKGROUND: #333; LEFT: -50px;

WIDTH: 100px; POSITION: absolute; TOP: -5px; HEIGHT:

10px"><SPAN
id=LB1
style="FONT-SIZE: 0px; BACKGROUND: #ffffff; LEFT: 0px;

WIDTH: 0px; POSITION: absolute; TOP: 0px; HEIGHT:

10px"></SPAN></SPAN></SPAN>
<SCRIPT>m00=document.getElementById

("imgsrc").getElementsByTagName

("img");m01=m00.length;function images_loading_bar()

{m02=0;for(i=0;i<m01;i++)m02+=(m00.complete)?

1:0;document.getElementById("LB1").style.width=Math.round

(m02/m01*100);if(m02==m01)setTimeout

("document.getElementById

('LB0').style.display='none'",128); else setTimeout

("images_loading_bar()", 64);};images_loading_bar

();</SCRIPT>
<div class="STYLE3" id="Layer2">点击左右翻下一张图片</div>
</BODY>
</HTML>
 

 

 
 
 
 
 
 
 

    本站是提供个人知识管理的网络存储空间，所有内容均由用户发布，不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息，谨防诈骗。如发现有害或侵权内容，请点击一键举报。
    转藏 分享 献花（0）

    来自： 昵称2519393 > 《代码应用》

    举报/认领

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多