18.01.2009, 03:00
|
|
Постоянный
Регистрация: 21.08.2008
Сообщений: 302
С нами:
9326973
Репутация:
-25
|
|
Сообщение от prescott
Создай полупрозрачную png картинку нужного размера. Вставь ее на страницу со свойством display: none. На событие onload вешаешь функцию которая позиционирует ее поверх картинки. Типа так:
Код HTML:
<html>
<head>
<script>
function gebi(el) {
return document.getElementById(el);
}
// функция вычисляет координаты объекта
function pos(el)
{
var r = { x: el.offsetLeft, y: el.offsetTop };
if (el.offsetParent)
{
var tmp = pos(el.offsetParent);
r.x += tmp.x;
r.y += tmp.y;
}
return r;
}
// устанавливаем координаты для пнг картинки
function setPos() {
// вычислим координаты нашей авы
var p=pos(gebi('kn'));
// переместим картинку на эти же координаты
gebi('kv').style.left=p.x;
gebi('kv').style.top=p.y;
// показываем ее
gebi('kv').style.display='block';
}
</script>
</head>
<body onLoad='setPos();'>
<img src='img/avafon.png' style='display: none; position: absolute; top: 0px; left: 0px;' id='kv'>
Content Content Content Content<br>
Content Content Content Content<img src='img/ava.jpg' id='kn'>
</body>
</html>
Далее на событие onclick картинки вешаешь функцию, перемещающую пнг относительно курсора. Как перемещать картинки ты уже знаешь =)
http://rapidshare.com/files/185136799/www.rar.html - пример с картинками А как зделать чтоб avafon.png можно было перетаскивать по ava.jpg ??
И как добавить прозвачность в скрипте avafon???
|
|
|