Регистрация Войти
Войти через VK Войти через FB Войти через Google Войти через Яндекс
Войти через VK Войти через FB Войти через Google Войти через Яндекс
Поиск по сайту
Плавающее меню
арихив фото
подбор интересных ссылок
подбор интересного софта
копилка анекдотов
Исходный код этого примера:
<style>
.fly { COLOR: aqua; FONT-FAMILY: arial; FONT-SIZE: 24px; line-height: 28px;
POSITION: absolute; VISIBILITY: hidden; Z-INDEX: 2}
.logo { COLOR: blue; FONT-FAMILY: times; FONT-SIZE: 72px; LEFT: 30px; line-height: 80px;
POSITION: absolute; TOP: 0px; VISIBILITY: visible; Z-INDEX: 1}
.desc { COLOR: red; FONT-FAMILY: arial; FONT-SIZE: 12px; LEFT: 40px; line-height: 14px;
POSITION: absolute; TEXT-ALIGN: center; TOP: 220px; VISIBILITY: hidden; WIDTH: 400px}
BODY { BACKGROUND: #000000}
A { COLOR: lime}
A:hover { COLOR: yellow; TEXT-DECORATION: none}
</style>
<script language="JavaScript">
/* Show an object */
function showObject(object) { object.visibility = VISIBLE; }
/* Hide an object */
function hideObject(object) { object.visibility = HIDDEN; }
/* Slide the logo from top to middle */
function slideLogo(from, to) {
if (from < to) {
company.top = (from += 10);
setTimeout('slideLogo(' + from + ',' + to + ')', 75);
}
else initObjects();
}
/* Rotate selected objects */
function rotateObjects() {
for (var i = 0; i < pos.length; i++) {
pos[i] += inc; objects[i].visibility = 'visible';
objects[i].left = (r * Math.cos(pos[i])) + xoff
objects[i].top = (r * Math.sin(pos[i])) + yoff;
}
rotateTimer = setTimeout("rotateObjects()", 70);
}
/* Initialize selected objects for rotation */
function initObjects() {
/* Here is the array of HTML elements that will be rotated, from fly1 to fly4
Just put the shortcut variables to the HTML elements in this little array
and they will be rotated automatically */
objects = new Array(fly1, fly2, fly3, fly4);
pos = new Array();
pos[0] = 0;
for (var i = 1; i < objects.length; i++) {
pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objects.length));
}
rotateObjects();
}
/* Variables for rotating objects */
var objects;
var pos;
var r = 160; // radius
var xoff = 180; // x offset
var yoff = 170; // y offset
var pi = Math.PI; // get pi
var inc = pi / 180; // degrees per rotation cycle
var objects; // objects to be rotated
var pos; // position for objects
</script>
<body bgColor="#FFFFFF" link="green" text="lime">
<div class="fly" id="fly1"><p><a onmouseout="hideObject(desc1)" onmouseover="showObject(desc1)" href="http://kdg.HtmlWeb.ru/" target="_blank">Мои фото</a> </p>
</div>
<div class="fly" id="fly2"><p><a onmouseout="hideObject(desc2)" onmouseover="showObject(desc2)" href="http://HtmlWeb.ru/" target="_blank">Ссылки</a> </p>
</div>
<div class="fly" id="fly3"><p><a onmouseout="hideObject(desc3)" onmouseover="showObject(desc3)" href="http://HtmlWeb.ru/" target="_blank">Софт</a> </p>
</div>
<div class="fly" id="fly4"><p><a onmouseout="hideObject(desc4)" onmouseover="showObject(desc4)" href="http://Htmlweb.ru" target="_blank">Анекдоты</a> </p>
</div>
<div class="logo" id="company"><p>Плавающее меню</p></div>
<div class="desc" id="desc1"><p>арихив фото</p></div>
<div class="desc" id="desc2"><p>подбор интересных ссылок</p></div>
<div class="desc" id="desc3"><p>подбор интересного софта</p></div>
<div class="desc" id="desc4"><p>копилка анекдотов</p></div>
<script language="JavaScript">
/* Simple version detection */
var isNS = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 4);
/* They can be used in place
of hidden and visible because on occasion Navigator has problems with the two */
var HIDDEN = (isNS) ? 'hide' : 'hidden';
var VISIBLE = (isNS) ? 'show' : 'visible';
/* Create shortcut variables for different absolutely positioned elements */
var fly1 = (isNS) ? document.fly1 : document.all.fly1.style;
var fly2 = (isNS) ? document.fly2 : document.all.fly2.style;
var fly3 = (isNS) ? document.fly3 : document.all.fly3.style;
var fly4 = (isNS) ? document.fly4 : document.all.fly4.style;
var company = (isNS) ? document.company : document.all.company.style;
var desc1 = (isNS) ? document.desc1 : document.all.desc1.style;
var desc2 = (isNS) ? document.desc2 : document.all.desc2.style;
var desc3 = (isNS) ? document.desc3 : document.all.desc3.style;
var desc4 = (isNS) ? document.desc4 : document.all.desc4.style;
/* Begin the sliding of the logo */
slideLogo(0, 140);
</script>
<p> </p>