-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
64 lines (40 loc) · 10.7 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>flipbook</title>
</head>
<body onLoad="" style="background-color:white;">
<!-- START Copy/Paste -->
<div id="bk_cont" style="position:relative;margin-left:auto;margin-right:auto;width:0px;height:0px;border:none;overflow:visible;">
<script type="text/javascript">
var img_folder="pages";
var page_width=842;
var page_height = 595;
var bk_pages = new Array ( ""// don't remove or change this line
,"Album_Chantier1.jpg"
,"Album_Chantier2.jpg"
,"Album_Chantier3.jpg"
,"Album_Chantier4.jpg"
,"Album_Chantier5.jpg"
,"Album_Chantier6.jpg"
,"Album_Chantier7.jpg"
,"Album_Chantier8.jpg"
,"Album_Chantier9.jpg"
,"Album_Chantier10.jpg"
,"Album_Chantier11.jpg"
,"Album_Chantier12.jpg"
,"Album_Chantier13.jpg"
,"Album_Chantier14.jpg"
,"Album_Chantier15.jpg"
,"Album_Chantier16.jpg"
,"Album_Chantier17.jpg"
,"Album_Chantier18.jpg"
,"Album_Chantier19.jpg"
,"Album_Chantier20.jpg"
,"Album_Chantier21.jpg"
);
var bk_curr_page=1; page_width = Math.floor(page_width/32)*32; var turn_lock = false; var hnd_bk_pgr = null; var hnd_bk_pgmv = null; var hnd_bk_pgl = null; var hnd_bk_nxt = null; var hnd_bk_bg = null; var hnd_bk_cont = null; function start_turn() { if (turn_lock == false) { if (bk_curr_page < (bk_pages.length-2)) { hnd_bk_pgr.src=img_folder+'/'+bk_pages[bk_curr_page+1]; } var start_left = 1; if (bk_curr_page < bk_pages.length-1) { hnd_bk_pgl.style.visibility = 'visible'; hnd_bk_pgr.style.visibility = 'visible'; if (bk_curr_page == 1) { start_left = (page_width/2); hnd_bk_pgl.style.visibility = 'hidden'; } else { hnd_bk_pgl.style.zIndex = 3; } if (bk_curr_page == (bk_pages.length-2)) { hnd_bk_pgr.style.visibility = 'hidden'; } hnd_bk_pgr.style.zIndex = 1; turn_page(page_width,start_left); } } } function turn_page(wdth,lft) { if (wdth>0) { turn_lock = true; var nxt_wd=wdth-32; var nxt_lf=lft+16; if (lft == (page_width/2)) { nxt_lf=lft; hnd_bk_pgmv.style.width=(nxt_wd/2)+'px'; } else { hnd_bk_pgmv.style.width=nxt_wd+'px'; if (bk_curr_page == (bk_pages.length-2)) { hnd_bk_bg.style.clip = 'rect(0px,'+((page_width+nxt_wd+24)/2)+'px,'+(page_height+2)+'px,0px)'; } } hnd_bk_pgmv.style.left=nxt_lf+'px'; var t=setTimeout("turn_page("+nxt_wd+","+nxt_lf+")",25); } else { hnd_bk_pgl.style.zIndex = 1; hnd_bk_pgmv.src=img_folder+'/'+bk_pages[bk_curr_page+1]; hnd_bk_pgr.style.zIndex = 3; finish_turn(0,(page_width/2)); } } function finish_turn(wdth,lft) { if (wdth<page_width) { var nxt_wd=wdth+32; var nxt_lf=lft-16; if (bk_curr_page >= (bk_pages.length-2)) { hnd_bk_pgmv.style.width=(nxt_wd/2)+'px'; } else { hnd_bk_pgmv.style.width=nxt_wd+'px'; if (bk_curr_page == 1) { hnd_bk_bg.style.clip = 'rect(0px,'+(page_width+24)+'px,'+(page_height+2)+'px,'+((page_width/2+12)-((nxt_wd+24)/2))+'px)'; } } hnd_bk_pgmv.style.left=nxt_lf+'px'; var t=setTimeout("finish_turn("+nxt_wd+","+nxt_lf+")",25); } else { bk_curr_page=bk_curr_page+1; if (bk_curr_page <= (bk_pages.length-2)) { hnd_bk_pgl.src=img_folder+'/'+bk_pages[bk_curr_page]; hnd_bk_pgmv.src=img_folder+'/'+bk_pages[bk_curr_page]; } hnd_bk_pgr.style.zIndex=1; turn_lock = false; } } function start_back() { if (turn_lock == false) { if (bk_curr_page > 2) { hnd_bk_pgl.src=img_folder+'/'+bk_pages[bk_curr_page+1]; } if (bk_curr_page > 1) { hnd_bk_pgl.style.visibility = 'visible'; hnd_bk_pgr.style.visibility = 'visible'; hnd_bk_pgr.src=img_folder+'/'+bk_pages[bk_curr_page]; hnd_bk_pgl.src=img_folder+'/'+bk_pages[bk_curr_page-1]; if (bk_curr_page == (bk_pages.length-1)) { hnd_bk_pgr.style.visibility = 'hidden'; } else if (bk_curr_page == 2) { hnd_bk_pgl.style.visibility = 'hidden'; } hnd_bk_pgr.style.zIndex = 3; hnd_bk_pgl.style.zIndex = 1; back_page(page_width,1); } } } function back_page(wdth,lft) { if (wdth>0) { turn_lock = true; var nxt_wd=wdth-32; var nxt_lf=lft+16; if (bk_curr_page < bk_pages.length-1) { hnd_bk_pgmv.style.width=nxt_wd+'px'; if (bk_curr_page == 2) { hnd_bk_bg.style.clip = 'rect(0px,'+(page_width+24)+'px,'+(page_height+2)+'px,'+((page_width-nxt_wd+24)/2)+'px)'; } } else { hnd_bk_pgmv.style.width=(nxt_wd/2)+'px'; } hnd_bk_pgmv.style.left=nxt_lf+'px'; var t=setTimeout("back_page("+nxt_wd+","+nxt_lf+")",25); } else { hnd_bk_pgr.style.zIndex = 1; hnd_bk_pgmv.src=img_folder+'/'+bk_pages[bk_curr_page-1]; hnd_bk_pgl.style.zIndex = 3; finish_back(0,page_width/2); } } function finish_back(wdth,lft) { if (wdth<page_width) { var nxt_lf = ((page_width/2)); var nxt_wd=wdth+32; if (bk_curr_page > 2) { nxt_lf=lft-16; hnd_bk_pgmv.style.left=nxt_lf+'px'; hnd_bk_pgmv.style.width=nxt_wd+'px'; if (bk_curr_page == (bk_pages.length-1)) { hnd_bk_bg.style.clip = 'rect(0px,'+(page_width+24+(nxt_wd-page_width)/2)+'px,'+(page_height+2)+'px,0px)'; } } else { hnd_bk_pgmv.style.left=nxt_lf+'px'; hnd_bk_pgmv.style.width=(nxt_wd/2)+'px'; } var t=setTimeout("finish_back("+nxt_wd+","+nxt_lf+")",25); } else { bk_curr_page=bk_curr_page-1; hnd_bk_pgl.src=img_folder+'/'+bk_pages[bk_curr_page]; hnd_bk_pgmv.src=img_folder+'/'+bk_pages[bk_curr_page]; hnd_bk_pgl.style.zIndex=1; turn_lock = false; } } function setup_book() { if (document.getElementById('bk_pgr') != null) { hnd_bk_pgr = document.getElementById('bk_pgr'); } if (document.getElementById('bk_pgmv') != null) { hnd_bk_pgmv = document.getElementById('bk_pgmv'); } if (document.getElementById('bk_pgl') != null) { hnd_bk_pgl = document.getElementById('bk_pgl'); } if (document.getElementById('bk_bg') != null) { hnd_bk_bg = document.getElementById('bk_bg'); } if (document.getElementById('bk_cont') != null) { hnd_bk_cont = document.getElementById('bk_cont'); } if (document.getElementById('bk_prv') != null) { hnd_bk_prv = document.getElementById('bk_prv'); } if (document.getElementById('bk_nxt') != null) { hnd_bk_nxt = document.getElementById('bk_nxt'); } if (document.getElementById('bk_pgdiv') != null) { hnd_bk_pgdiv = document.getElementById('bk_pgdiv'); } if (hnd_bk_nxt != null) { hnd_bk_nxt.style.left = (page_width+20)+'px'; } if (hnd_bk_cont != null) { hnd_bk_cont.style.width = (page_width+2)+'px'; hnd_bk_cont.style.height = (page_height)+'px'; } if (hnd_bk_bg != null) { hnd_bk_bg.style.height = (page_height+2)+'px'; hnd_bk_bg.style.width = (page_width+24)+'px'; } if (hnd_bk_pgmv != null) { hnd_bk_pgmv.style.width = (page_width)+'px'; hnd_bk_pgmv.style.height = (page_height)+'px'; hnd_bk_pgmv.style.clip = 'rect(0px,'+(page_width)+'px,'+(page_height)+'px,0px)'; hnd_bk_pgmv.src = img_folder+'/'+bk_pages[1]; } if (hnd_bk_pgl != null) { hnd_bk_pgl.style.width = (page_width)+'px'; hnd_bk_pgl.style.height = (page_height)+'px'; hnd_bk_pgl.style.clip = 'rect(0px,'+(page_width/2)+'px,'+(page_height)+'px,0px)'; hnd_bk_pgl.src = img_folder+'/'+bk_pages[2]; } if (hnd_bk_pgr != null) { hnd_bk_pgr.style.width = (page_width)+'px'; hnd_bk_pgr.style.height = (page_height)+'px'; hnd_bk_pgr.style.clip = 'rect(0px,'+(page_width)+'px,'+(page_height)+'px,'+(page_width/2)+'px)'; hnd_bk_pgr.src = img_folder+'/'+bk_pages[1]; var img_loader = ''; } for (var i = 1; i < bk_pages.length; i++) { img_loader += '<img style="position:absolute;top:0px;left:0px;width:0px;height:0px;" src="'+img_folder+'/'+bk_pages[i]+'" />'; } document.getElementById('bk_img_loader').innerHTML = img_loader; hnd_bk_pgmv.style.width = (page_width/2)+'px'; hnd_bk_pgmv.style.left = (page_width/2)+'px'; hnd_bk_bg.style.visibility = 'visible'; hnd_bk_pgl.style.visibility = 'hidden'; hnd_bk_pgmv.style.visibility = 'visible'; hnd_bk_pgr.style.visibility = 'visible'; hnd_bk_prv.style.visibility = 'visible'; hnd_bk_nxt.style.visibility = 'visible'; hnd_bk_pgdiv.style.visibility = 'visible'; hnd_bk_prv.style.top = ((page_height-38)/2)+'px'; hnd_bk_nxt.style.top = ((page_height-38)/2)+'px'; hnd_bk_bg.style.clip = 'rect('+(0)+'px,'+(page_width+24)+'px,'+(page_height+2)+'px,'+(page_width/2+12)+'px)'; hnd_bk_pgdiv.style.height = page_height+'px'; hnd_bk_pgdiv.style.left = ((page_width/2)+1)+'px'; /*keep_track();*/ } /* function keep_track() { document.getElementById('console_page').value=bk_curr_page; document.getElementById('console_pgmv_z').value = hnd_bk_pgmv.style.zIndex+" -- "+hnd_bk_pgmv.style.visibility; document.getElementById('console_pgl_z').value=hnd_bk_pgl.style.zIndex+" -- "+hnd_bk_pgl.style.visibility; document.getElementById('console_pgr_z').value=hnd_bk_pgr.style.zIndex+" -- "+hnd_bk_pgr.style.visibility; document.getElementById('console_pgmv_pos').value= "lf: "+hnd_bk_pgmv.style.left+" -- wd: "+hnd_bk_pgmv.style.width; document.getElementById('console_pgl_pos').value= "lf: "+hnd_bk_pgl.style.left+" -- wd: "+hnd_bk_pgl.style.width; document.getElementById('console_pgr_pos').value= "lf: "+hnd_bk_pgr.style.left+" -- wd: "+hnd_bk_pgr.style.width; var t = setTimeout("keep_track();",250); }*/ </script> <img id="bk_bg" style="position:absolute;left:-11px;top:0px;height:0px;width:0px;z-index:0;visibility:hidden;" src="img/book_bg.png"/> <img id="bk_pgl" style="position:absolute;left:1px;top:1px;height:0px;width:0px;z-index:1;border:none;visibility:hidden;" src="" /> <img id="bk_pgmv" style="position:absolute;left:1px;top:1px;height:0px;width:0px;z-index:2;border:none;border-right:solid 1px #444444;border-left:solid 1px #444444;visibility:hidden;" src="" /> <img id="bk_pgr" style="position:absolute;left:1px;top:1px;height:0px;width:0px;z-index:1;border:none;visibility:hidden;" src=""/> <img id="bk_prv" style="position:absolute;left:-56px;top:0px;height:38px;width:38px;cursor:pointer;z-index:5;visibility:hidden;" src="img/book_prv.png" onMouseOver="hnd_bk_prv.src='img/book_prv_.png';" onMouseOut="hnd_bk_prv.src='img/book_prv.png';" onClick="start_back();"/> <img id="bk_nxt" style="position:absolute;left:-56px;top:0px;height:38px;width:38px;cursor:pointer;z-index:5;visibility:hidden;" src="img/book_nxt.png" onMouseOver="hnd_bk_nxt.src='img/book_nxt_.png';" onMouseOut="hnd_bk_nxt.src='img/book_nxt.png';" onClick="start_turn();" /> <div id="bk_pgdiv" style="position:absolute;left:0px;top:1px;height:0px;width:0px;border:none;border-left:solid 1px #444444;z-index:4;visibility:hidden;"></div> </div> <img src="img/trans.gif" style="position:absolute;top:0px;left:0px;width:0px;height:0px;border:none;" onLoad="setup_book();" /> <div id="bk_img_loader" style="position:absolute;top:0px;left:0px;width:0px;height:0px;overflow:hidden;border:none;visibility:hidden;"></div> <!-- <br />page:<input type="text" id="console_page" value="" /> <br />pgmv z:<input type="text" id="console_pgmv_z" value="" /> <br />pgl z:<input type="text" id="console_pgl_z" value="" /> <br />pgr z:<input type="text" id="console_pgr_z" value="" /> <br />pgmv:<input type="text" id="console_pgmv_pos" value="" /> <br />pgl:<input type="text" id="console_pgl_pos" value="" /> <br />pgr:<input type="text" id="console_pgr_pos" value="" /> -->
<!-- END Copy/Paste -->
</body>
</html>