VPF::Перемещение объекта - Форум программистов

Цербер

Дата 27.6.2008, 09:36 (ссылка)

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

Загрузка ...

Опытный

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

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

Доброе время суток!
Есть функция которая перемещает объект, визуально это перемещение видно и всё нормально работает, но работает только в FF а IE он при перемещении, создаёт дубликат объекта и этот дубликат перемещает а оригинал остаётся на месте, ну а в Opera совсем не работает=(
В JavaScript я тока начинаю, не судите строго!
Помогите пожалуста!
Вот код:
HTML

Код


<a href="#" onclick="move_going('going',10,5,'forward',500,500)">Переместить</a>
<a href="#" onclick="move_going('going',10,5,'back',250,250)">Вернуть</a>
<img src="img/counter.jpg" id="going" style="position:absolute; top:250px; left:250px;"/>

JavaScript

Код


function going_div(id,need_top,need_left,flag,step)
{
    theObj = document.getElementById(id);
    now_top = theObj.style.top.replace(/px/,"");
    now_left = theObj.style.left.replace(/px/,"");
    if(flag=='forward')
    {
        if(Number(need_top)<=Number(now_top))
        {
            clearInterval(inter_id);    
        }
        else 
        {
            new_top= Number(now_top)+Number(step);
            theObj.style.top=new_top + 'px';    
            new_left = Number(now_left)+Number(step);
            theObj.style.left=new_left + 'px';
        }
    }
    else if(flag=='back')
    {
        if(Number(need_top)>=Number(now_top))
        {
            clearInterval(inter_id);    
        }
        else 
        {
            new_top= Number(now_top)-Number(step);
            theObj.style.top=new_top + 'px';    
            new_left = Number(now_left)-Number(step);
            theObj.style.left=new_left + 'px';
        }        
    }
    
}
function move_going(id,interval,step,flag,need_top,need_left)
{
    function going()
    {
        going_div(id,need_top,need_left,flag,step);    
    }
    inter_id = window.setInterval(going,interval);
}

Ghirik

Дата 27.6.2008, 09:44 (ссылка)

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

Загрузка ...

Опытный

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

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

Проверил во всех браузерах - работает.

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Title block</title>
<style type="text/css">

</style>
<script type="text/javascript">
<!-- // --><![CDATA[

function going_div(id,need_top,need_left,flag,step)
{
    theObj = document.getElementById(id);
    now_top = theObj.style.top.replace(/px/,"");
    now_left = theObj.style.left.replace(/px/,"");
    if(flag=='forward')
    {
        if(Number(need_top)<=Number(now_top))
        {
            clearInterval(inter_id);    
        }
        else 
        {
            new_top= Number(now_top)+Number(step);
            theObj.style.top=new_top + 'px';    
            new_left = Number(now_left)+Number(step);
            theObj.style.left=new_left + 'px';
        }
    }
    else if(flag=='back')
    {
        if(Number(need_top)>=Number(now_top))
        {
            clearInterval(inter_id);    
        }
        else 
        {
            new_top= Number(now_top)-Number(step);
            theObj.style.top=new_top + 'px';    
            new_left = Number(now_left)-Number(step);
            theObj.style.left=new_left + 'px';
        }        
    }
    
}

function move_going(id,interval,step,flag,need_top,need_left)
{
    function going()
    {
        going_div(id,need_top,need_left,flag,step);    
    }
    inter_id = window.setInterval(going,interval);
}

// ]]>
</script>
</head>
<body>

<a href="#" onclick="move_going('going',10,5,'forward',500,500)">Переместить</a>
<a href="#" onclick="move_going('going',10,5,'back',250,250)">Вернуть</a>
<img src="img/counter.jpg" id="going" style="position:absolute; top:250px; left:250px;" width="190" height="100"/>

</body>
</html>

Наверное неправильно собрали страничку.

--------------------

Отдадим всё клиенту, пускай его машина мучается...

Цербер

Дата 27.6.2008, 09:58 (ссылка)

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

Загрузка ...

Опытный

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

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

Ghirik

Цитата

Наверное неправильно собрали страничку.

Прислушался к вашим словам и удалил всё со страницы кроме этого кода.
В итоге IE перестал глюкать и изображение перестало дублироваться.
и ещё заметил что не добавил в ссылку return false
<a href="#" onclick="move_going('going',10,5,'forward',500,500); return false">
<a href="#" onclick="move_going('going',10,5,'back',250,250); return false">
Огромное спасибо!

Это сообщение отредактировал(а) Цербер - 27.6.2008, 09:59

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