Dateigrösse: 5.08 kb
1 <style type="text/css"> 2 body, html { overflow-x: hidden; overflow-y: hidden; } 3 h1.impress { font-family:palatino,candara,verdana,sans-serif; font-size:22pt !important; margin:0; padding-bottom:20pt !important; } 4 #ice { opacity: 0.25; filter: alpha(opacity=25); border:1px solid #69c; margin-bottom:3pt; } 5 a.this { font: bold 9px verdana, sans-serif; color:#f8f8ff; text-decoration:none; padding:1px 2px; margin:0pt; } 6 a.small { font-weight: lighter; margin-top:2em; cursor:default !important; } 7 a.this:hover{ color:#aaa; background-color:transparent; } /* */ 8 .impressum { float:left !important; margin-right:5em; border:0px solid white; font-size:16px !important; } 9 .oops { font: bold 11px verdana, sans-serif; color:green; padding:1em; margin:0pt 5pt; } 10 p.txt { font-family:palatino,verdana,sans-serif; font-size:11.75pt; padding-bottom:11pt; } 11 p.clear { clear:left; padding:0; margin:0; } 12 </style> 13 14 <script type="text/javascript"> 15 <!-- 16 var bilder = new Array("_1.jpg","_2.jpg","_3.jpg","_4.jpg","_5.jpg","_6.jpg","_7.jpg","_8.jpg","_9.jpg","_10.jpg","_11.jpg","_12.jpg","_13.jpg","_14.jpg","_15.jpg","_16.jpg","_17.jpg","_18.jpg","_19.jpg","_20.jpg","_21.jpg","_22.jpg","_23.jpg","_24.jpg","_25.jpg","_26.jpg","_27.jpg","_28.jpg","_29.jpg"); 17 var bild = new Array(); 18 var pfad = "img/img_ice/"; 19 20 function bilder_vorladen() { 21 if(document.images) { 22 for(i=0; i< bilder.length; i++) { 23 bild[i]=new Image(); 24 bild[i].src=pfad + bilder[i]; 25 } 26 } 27 console.log('images are loaded!'); 28 } 29 30 var current_image=23; 31 function rotate() 32 { 33 //current_image = (current_image==false) ? 2 : current_image; //needed only if written return false in line 47/55 34 $("ice").setAttribute("src", pfad+"_"+current_image+".jpg"); 35 $("ice").setAttribute("title", pfad+"_"+current_image+".jpg"); 36 //$("oops").innerHTML+=$("ice").src + "<br>"; 37 current_image=(current_image< bilder.length) ? current_image+1 : sliderepeat(); 38 } 39 40 var n=1; 41 function sliderepeat() { 42 n++; 43 if(n<9) { 44 window.clearInterval(aktiv); 45 slidestart(120/n); 46 if(n==6) { window.setTimeout ( function() { quiteFotoShow(100) }, 10 ); } 47 return 2; 48 } else { 49 window.clearInterval(aktiv); 50 n=1; 51 //$("ice").setAttribute("src", pfad+"_22.jpg"); 52 //$("ice").setAttribute("title", pfad+"_22.jpg"); 53 //$("oops").innerHTML="<br>finito...<br />"; 54 $("oops").innerHTML+="<hr />"; 55 return 23; 56 //window.setTimeout ( function() { fotoShowStop() }, 1250 ); 57 //window.setTimeout ( function() { quiteFotoShow(100) }, 10 ); 58 } 59 } 60 61 var isIE = (document.all) ? true : false; 62 var isW3C = (document.getElementById && !document.all) ? true : false; 63 64 function slidestart(interval) { 65 aktiv = window.setInterval("rotate()", interval); 66 $("oops").style.display="none"; 67 } 68 69 var starting_image=23; 70 function fotoShowStart() { 71 $("impressum").style.display="block"; 72 $("portrait").style.display="none"; 73 if(isIE) $("impressum").style.filter = "alpha(opacity=100)"; 74 if(isW3C) $("impressum").style.opacity = 1; 75 $("ice").setAttribute("width", 87+"px"); 76 $("ice").setAttribute("height", 110+"px"); 77 $("ice").setAttribute("src", pfad+"_"+starting_image+".jpg"); 78 slidestart(100); 79 } 80 81 function fotoShowStop() { 82 $("impressum").style.display="none"; 83 } 84 85 /* quite FotoShow */ 86 function quiteFotoShow(t) { 87 if(isIE) $("impressum").style.filter = "alpha(opacity="+t+")"; 88 if(isW3C) $("impressum").style.opacity = t/100; 89 $("ice").setAttribute("width", 87*(100/t)+"px"); 90 $("ice").setAttribute("height", 110*(100/t)+"px"); 91 /* var x = lokale Variable, x = globale Variable */ 92 var restart = t-1; 93 if(0<t) { 94 var active = setTimeout("quiteFotoShow("+restart+")",15); 95 } else { 96 clearTimeout(active); 97 $("portrait").style.display="block"; 98 } 99 } 100 101 /**************************************************/ 102 function $(string) { 103 return document.getElementById(string); 104 } 105 /**************************************************/ 106 107 function addLoadEvent(func) { 108 var oldonload = window.onload; 109 if (typeof window.onload != 'function') { 110 window.onload = func; 111 } else { 112 window.onload = 113 function() { 114 oldonload(); 115 func(); 116 } 117 } 118 } 119 /*************************************************/ 120 /* muss in der index.php aufgerufen werden: 121 window.onload=addLoadEvent( bilder_vorladen() ) 122 */ 123 //--> 124 </script> 125 126 <h1 class="impress">impressum</h1> 127 128 <div class="impressum"> 129 <p class="txt">♣ mi.ster</p> 130 <p class="txt">♠ webdesign</p> 131 <p class="txt">♥ ganimede[at]bluewin[dot]ch</p> 132 <p class="txt">♦ don't be shy - contact me!</p> 133 134 <p> </p> 135 136 <a id="portrait" class="this small" href="#" onclick="fotoShowStart();" onfocus="if(this.blur)this.blur();">• foto</a> 137 </div> 138 139 <div class="impressum" id="impressum" style="display:none;"> 140 <img src="img/img_ice/_22.jpg" id="ice" name="ice" alt="" title="" width="87" height="110" /> 141 <br> 142 <!-- 143 <a class="this" href="#" onclick="slidestart(100);">start slideshow</a> 144 --> 145 </div> 146 147 <div class="impressum oops" id="oops" style="display:none;"></div> 148 149 <p class="clear"> </p> 150 151