Efektně se měnící text

Efektně se měnící text

Pokud chcete dát na svůj web něco malého, co se mění, jako třeba reklamu nebo krátké novinky, jistě využijete tohoto skriptu.

Jde o jednoduchý javascript, který za použití CSS3 přechodu skryje text, změní ho a zase odkryje. Při lehké znalosti javascriptu si můžete i přidat další texty, které se budou měnit dokola.

 

Kód:

<style>
#obrazky { transition: opacity 1s; -webkit-transition: opacity 1s }
</style><script type=“text/javascript“>
var num=1; setInterval(function() { num++; switch(num) { case 1: obrazky.style.opacity=0; setTimeout(function() {obrazky.innerHTML=“první text„; obrazky.style.opacity=1},1000); break; case 2: case 1: obrazky.style.opacity=0; setTimeout(function() {obrazky.innerHTML=“druhý text„; obrazky.style.opacity=1},1000); } if(num==2) num=0 },6000)
</script>
<div id=“obrazky“></div>

Zvýrazněné číslo udává počet milisekund, jak často se bude text měnit (1 sekunda = 1000 milisekund).

Ukázka:

HTML Kody

Leave a Reply