VPF::Увеличение\Приближение изображения

SiNaC0m

Дата 23.4.2007, 18:52 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 12
Регистрация: 20.9.2006
Где: Tyumen

Репутация: нет
Всего: нет

Код


<html>

<script type="text/javascript">
var Timer;

function ScrollLeft()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollLeft -= 2", 10);
}
function ScrollRight()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollLeft += 2", 10);
}
function ScrollUp()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollTop += 2", 10);
}
function ScrollDown()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollTop -= 2", 10);
}
function Resize()
{
Timer = setInterval("document.getElementById('picture').style.width=parseInt(document.getElementById('picture').style.width)-10+'px'", 30);
T = setInterval("document.getElementById('p1').style.width=parseInt(document.getElementById('p1').style.width)-10+'px'", 30);
}
function Resizee()
{
Timer = setInterval("document.getElementById('picture').style.width=parseInt(document.getElementById('picture').style.width)+10+'px'", 30);
T = setInterval("document.getElementById('p1').style.width=parseInt(document.getElementById('p1').style.width)+10+'px'", 30);
}
</script>
<div id="PANORAMA" style="width:700px; height:550px; border: 1px solid;overflow:hidden">
<img id='p1' src='1.gif' style="position:absolute;left:123px;top:343px">
<img id="picture" src="2.gif" style="width:700px"/>
</div>
<div style="width:700px; text-align:center">
<input type="button" value="<" title="Scroll left" style="width:25px"
onmousedown="ScrollLeft()"
onmouseup="clearInterval(Timer)">
<input type="button" value=">" title="Scroll right" style="width:25px"
onmousedown="ScrollRight()"
onmouseup="clearInterval(Timer)">
<input type="button" value="\/" title="Scroll down" style="width:25px"
onmousedown="ScrollUp()"
onmouseup="clearInterval(Timer)">
<input type="button" value="/\" title="Scroll up" style="width:25px"
onmousedown="ScrollDown()"
onmouseup="clearInterval(Timer)">
<input type="button" value="-" title="-" style="width:25px"
onmousedown="Resize()"
onmouseup="clearInterval(Timer,T)">
<input type="button" value="+" title="+" style="width:25px"
onmousedown="Resizee()"
onmouseup="clearInterval(Timer,T)">
</div>
</html>

Кто-нибудь, объясните мне пожалуйсто, почему у меня объявленные функции действуют только на id="picture", а на id='p1' не деуствуют!? Где ошибка?

SiNaC0m

Дата 6.5.2007, 00:48 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 12
Регистрация: 20.9.2006
Где: Tyumen

Репутация: нет
Всего: нет

Решил сделать маленько по-другому, заместо нанесения изображения, я стал использовать разметку этого изображения с помощью тегов map и area. Но, возникла проблема. Теперь вся картинка не масштабируется. Люди, пожалуйсто объясните, в чем заключается моя ошибка. А то какой то замкнутый круг получается.

Код



<script type="text/javascript">
var Timer;

function ScrollLeft()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollLeft -= 2", 10);
}
function ScrollRight()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollLeft += 2", 10);
}
function ScrollUp()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollTop += 2", 10);
}
function ScrollDown()
{
Timer = setInterval("document.getElementById('PANORAMA').scrollTop -= 2", 10);
}
function Resize()
{
Timer = setInterval("document.getElementById('karta').style.width=parseInt(document.getElementById('karta').style.width)-10+'px'", 30);
}
function Resizee()
{
Timer = setInterval("document.getElementById('karta').style.width=parseInt(document.getElementById('karta').style.width)+10+'px'", 30);
}
</script>
<div id="PANORAMA" style="width:450px; height:340px; border: 1px solid;
overflow:hidden">
<img  src="1.gif"  usemap="#karta1" id="karta">
<map name="karta1">

<area  shape="rect" coords="25,36,114,98"  onClick="window.open('opened.html', 'joe',
config='height=300,width=300')">
</map> 
</div>

<div style="width:700px; text-align:center">
<input type="button" value="<" title="Scroll left" style="width:25px"
onmousedown="ScrollLeft()"
onmouseup="clearInterval(Timer)">
<input type="button" value=">" title="Scroll right" style="width:25px"
onmousedown="ScrollRight()"
onmouseup="clearInterval(Timer)">
<input type="button" value="\/" title="Scroll down" style="width:25px"
onmousedown="ScrollUp()"
onmouseup="clearInterval(Timer)">
<input type="button" value="/\" title="Scroll up" style="width:25px"
onmousedown="ScrollDown()"
onmouseup="clearInterval(Timer)">
<input type="button" value="-" title="-" style="width:25px"
onmousedown="Resize()"
onmouseup="clearInterval(Timer)">
<input type="button" value="+" title="+" style="width:25px"
onmousedown="Resizee()"
onmouseup="clearInterval(Timer)">
</div>

Это сообщение отредактировал(а) SiNaC0m - 6.5.2007, 00:49

AKS

Дата 6.5.2007, 05:54 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

SiNaC0m, вот как-раз вариант с map давно уже сделан человеком по имени Ksnk на Форуме «Лаборатории dk» в вашей теме (можно сказать, специально для Вас). Что же Вас заставляет избегать возможности заглянуть в готовый вариант?

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »