<html>
<head>
	<title>Animace noviny</title>
<script>
var X = 0; 		// aktualni pozice X
var Y = 0; 		// aktualni pozice Y
var Y1 = -100;
var Y2 = 0;		// Y od -100 do 0
var X1 = 0;
var X2 = 0;		// X od -0 do 0
var smerX = 0; 		// -1 / 0 / +1
var smerY = 1; 		// -1 / 0 / +1
var krokX = 0; 		// +0 (px)
var krokY = 4; 		// +4 (px)
var casovac  = null; 	// promenna, kam je ulozen casovac
var ani_runtime  = 100;		//100 ms cas kroku
var ani_stoptime = 1000;	//3000 ms cas pozastaveni
var ani_index  = -1;
var ani_blockx  = 0;
//var ani_indexb = 0;
var ani_tr = [
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/su_gif.gif" alt="su_gif.gif" height="80" width="80">',
 '1/6 <span class="link-external"><a href="http://www.slu.cz/"><i><b>SLEZSKÁ&nbsp;UNIVERZITA V OPAVĚ,</b></i></a></span><br>zastoupená rektorem Doc. PhDr. Rudolfem Žáčkem, CSc.'],
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/ostravska_univerzita.gif" alt="ostravska_univerzita.gif" height="81" width="80">',
 '2/6 <span class="link-external"><a href="http://www.osu.cz/"><i><b>OSTRAVSKÁ UNIVERZITA V OSTRAVĚ,</b></i></a></span> <br>zastoupená rektorem Prof. RNDr. Jiřím Močkořem, DrSc.'],
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/vroclav.gif" alt="vroclav.gif" height="81" width="80">',
 '3/6 <span class="link-external"><a href="http://www.uni.wroc.pl/"><i><b>UNIWERSYTET WROCŁAWSKI WE WROCŁAWIU,</b></i></a></span><br>zastoupená&nbsp;rektorem Prof. Markem&nbsp;Bojarskim<span><strong>&nbsp;</strong></span><span>&nbsp; </span>'],
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/katovice_sl.gif" alt="katovice_sl.gif" height="80" width="80">',
 '4/6 <span class="link-external"><a href="http://www.us.edu.pl/"><strong><em>UNIWERSYTET ŚLĄSKI W KATOWICACH,</em></strong></a></span><br>zastoupená rektorem Prof. dr hab. Wiesławem&nbsp;Bany<span>śem</span>'],
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/katovice.gif" alt="katovice.gif" height="90" width="80">',
 '5/6 <span class="link-external"><a href="http://www.ae.katowice.pl/"><i><b>AKADEMIA EKONOMICZNA IM. KAROLA ADAMIECKIEGO W KATOWICACH,</b></i></a></span> <br>zastoupená rektorem&nbsp;Prof. AE dr hab. Janem&nbsp;Pykou'],
['<img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/opole.gif" alt="opole.gif" height="74" width="80">',
 '6/6 <i><b><span class="link-external"><a href="http://www.uni.opole.pl/"><i><b>UNIWERSYTET OPOLSKI W OPOLU</b></i></a></span>,</b></i><br>zastoupená rektorem Prof. dr hab. in<span>ż. Krystynou Czajou&nbsp;</span>']
];


function animaceMove(bool,b)
{
var o1,o2;
if (ani_blockx)
	{
	o1 = document.getElementById("ani_blok1");
	o2 = document.getElementById("ani_blok2");
	}
else	{
	o1 = document.getElementById("ani_blok2");
	o2 = document.getElementById("ani_blok1");
	}
if (bool)
	{
	animaceBlok(o1,b)
	Y = Y1;
	}
o1.style.left = X + "px";
o1.style.top  = Y + "px";
o2.style.left = (X + X2 - X1) + "px";
o2.style.top  = (Y + Y2 - Y1) + "px";
}

function animaceStart()
{
animaceStop();
casovac = window.setInterval("animaceKrok()", ani_runtime);
}

function animaceStop()
{
clearTimeout(casovac);
}

function animaceKrok()
{
X += smerX * krokX;
Y += smerY * krokY;
if (Y<Y1+krokY)
	{smerY = 1;}
if (Y>Y2)
	{
	animaceChangeStart();
	return;
	}
animaceMove(false,0);
}

function animaceBlok(obj,i)
{
obj.innerHTML = '<table><tr><td>'+ani_tr[i][0]+'</td><td>'+ani_tr[i][1]+'</td></tr></table>';
}

function animaceChangeStart()
{
	animaceStop();
	casovac = window.setInterval("animaceChange()", ani_stoptime);
}

function animaceChange()
{
var b;
animaceStop();
if (ani_index<0)
	{
	ani_index = 0;
	b = ani_index + 1;
	}
else	{
	if (ani_index>ani_tr.length-3)
		{
		b = 0;
		ani_index = -1;
		}
	else	{
		ani_index++;
		b = ani_index + 1;
		}
	}
ani_blockx = ani_index % 2;
animaceMove(true,b);
animaceStart();
}

function animaceInit()
{
//animaceBlok(document.getElementById("ani_blok1"),ani_index)
animaceChangeStart();
}

</script>
</head>

<body>

<h2>Jednoduchá animace jako Marquee</h2>

<div style="position:relative; height:100px; border:1px solid #f00; z-index:10; overflow:hidden;">
<div id="ani_blok1" style="position:absolute;height:100px;">
<table class="plain">
<tbody>
<tr>
<td><img class="image-left" src="http://www.slu.cz/konference-rektoru-slezskych-univerzit/docs/su_gif.gif" alt="su_gif.gif" height="80" width="80"></td>
<td><span class="link-external"><a href="http://www.slu.cz/"><i><b>SLEZSKÁ&nbsp;UNIVERZITA V OPAVĚ,</b></i></a></span><br>zastoupená rektorem Doc. PhDr. Rudolfem Žáčkem, CSc.</td>
</tr>
</tbody>
</table>
</div>
<div id="ani_blok2" style="position:absolute; height:100px; top:-6em">blabla</div>
      
</div>
<script>
animaceInit();
//animaceStart();	// spusteni animace
</script>

<form>
<p>
<input type="button" value="Start"       onclick="animaceStart();">
<input type="button" value="Stop"        onclick="animaceStop();" >
</p>
</form>

<h3>Nadpis</h3>
<p>blabla</p>

</body>
</html>


