Форум программистов [Powered by Invision Power Board]

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>   
   <Head>
      <Meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
      <title>::</title>
      <Style type="text/css"><!--
         Body {margin: 0; font-size: 12px; font-family: Verdana, Geneva, Arial;}
         .O6epmKa {width: 100%; height: 100%; text-align: center;}         
   --></Style>
      <script type="text/javascript" language="JavaScript"><!--         
         // Число: 1 или 2 + зеркальное отражение
         var Oug = 1;
         function OguH_uvu_gBa() {
            if (Oug == 1) {
               document.getElementById('b_Oug1').innerHTML = Oug;
               document.getElementById('strong_Oug2').innerHTML = Oug;
               Oug = 2;
               document.getElementById('b_Oug2').innerHTML = Oug;
               document.getElementById('strong_Oug1').innerHTML = Oug
               }
            else {
               document.getElementById('b_Oug1').innerHTML = Oug;
               document.getElementById('strong_Oug2').innerHTML = Oug;
               Oug = 1;
               document.getElementById('b_Oug2').innerHTML = Oug;
               document.getElementById('strong_Oug1').innerHTML = Oug
               }
            }
        
         // Число: от 1 до N
         var Om1goN = 0;
         var N = 5; /* Число всех картинок */
         function Om_1_go_N() {
            if (Om1goN < N) {
               Om1goN = Om1goN + 1;
               //document.getElementById('b_Om1goN').innerHTML = Om1goN       
               }
            else {
               Om1goN = 1;
               //document.getElementById('b_Om1goN').innerHTML = Om1goN
               }
            }
         
         // Смена картинки
         function CMeHa_KapmuHoK() {
            var NuO = Om1goN + 1;
            if (Om1goN == N) {
               Om1goN = 1;
               document.getElementById('b_Om1goN').innerHTML = Om1goN;
               document.getElementById('KapmuHKa_1').src = 'img/' + Om1goN + '.jpg'
               }
            else {
               document.getElementById('b_Om1goN').innerHTML = Om1goN;
               document.getElementById('KapmuHKa_1').src = 'img/' + Om1goN + '.jpg'
               }
            if (NuO > N) {
               NuO = Om1goN + 1;
               document.getElementById('strong_NuO').innerHTML = NuO;
               document.getElementById('KapmuHKa_2').src = 'img/' + NuO + '.jpg'
               }
            else {
               document.getElementById('strong_NuO').innerHTML = NuO;
               document.getElementById('KapmuHKa_2').src = 'img/' + NuO + '.jpg'
               }
            } 
            
         // Гаснет
         var a = 100, time; 
         function Start(e) {   
            if(e) {
               time = setInterval('racHem()', 10); 
               }
            else {
               clearInterval(time);
               a = 0;
               document.getElementById('b_Oug').innerHTML = a
               }
            }
         function racHem() {
            a--;
            if(a >= 0) {
               document.getElementById('b_Oug').innerHTML = a;
               document.getElementById('KapmuHKa_1').style.filter = 'alpha(opacity =' + a + ')'
               }
            else {
               clearInterval(time);
               a = 100;
               }
            }
            
         function All() {
            OguH_uvu_gBa();
            Om_1_go_N();
            CMeHa_KapmuHoK();
            Start(1)
            }
            
   --></Script>
   </Head>
   <Body onLoad="All()">
      <table class="O6epmKa" cellpadding="0" cellspacing="0">
         <tr>
            <td>
               <div style="height: 100px;">
                  <img id="KapmuHKa_1" src="img/1.jpg" style="position: absolute; z-index: 2">
                  <img id="KapmuHKa_2" src="img/2.jpg" style="position: absolute; z-index: 1">               
               </div>
               <div onClick="All()" style="margin: 15px; padding: 5px; width: 55px; background-color: #f0f0f0; cursor: hand; border: 1px solid black;">Жми!</div>
               &lt;img id=&quot;KapmuHKa_<b id="b_Oug1"></b>&quot; src=&quot;img/<b id="b_Om1goN"></b>.jpg&quot; style=&quot;z-index: <b id="b_Oug2"></b>&quot;&gt; <br>
               &lt;img id=&quot;KapmuHKa_<strong id="strong_Oug1"></strong>&quot; src=&quot;img/<strong id="strong_NuO"></strong>.jpg&quot; style=&quot;z-index: <strong id="strong_Oug2"></strong>&quot;&gt; <br>
               <b id="b_Oug"></b>       
            </td>
         </tr>
      </table>
   </Body>
</HTML>