1. CSS
#text {
height: 100px;
}
.name {
font: 30px Tahoma;
display: block;
margin: 0 0 10px 0;
color: #0094d6;
text-shadow: 1px 1px 0 white, 2px 2px 2px #DDD;
}
.descr {
font: 15px Tahoma;
padding: 0 0 0 35px;
color: #ff7700;
display: block;
}
2. Подключение jQuery
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js'></script>
3. Подключение jQuery.Cycle.Lite
<script type="text/javascript" src="https://raw.github.com/malsup/cycle/master/jquery.cycle.lite.js"></script>
4. JavaScript
<script type="text/javascript">
$(document).ready(function() {
var parentTaglineEl = $('#text');
parentTaglineEl.cycle({
fx: 'fade',
speed: 1000,
timeout: 6000,
random: 0
});
});
</script>
5. HTML
<div id="text">
<div><span class="name">Дубна</span><span class="descr"> — наукоград на севере Московской области, крупнейший в России центр по исследованиям в области ядерной физики.</span></div>
<div><span class="name">Жуковский</span><span class="descr"> — город в Московской области России. Наукоград Российской Федерации. Расположен в 25 км к юго-востоку от Москвы.</span></div>
<div><span class="name">Королёв</span><span class="descr"> — город областного подчинения в Московской области России, наукоград, сотрудничает с 52 городами из 26 стран мира.</span></div>
</div>