VPF::событие onmouseup разное поведение в IE и Opera

Leonid1611

Дата 12.6.2008, 20:43 (ссылка)

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

Загрузка ...

Новичок

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

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

Событие onmouseup определено в атрибутах слоя (div). Работает так как хотелось бы в Opera, а в IE и FF событие происходит только после нового щелчка. События используется для реализации перетаскивания. Т.е. в Opera нажимаем кнопку мыши перетаскиваем отпускаем перетаскивание оканчивается, а IE и FF элемент продолжает "тащиться" за мышью, пока снова не сделаешь click. В чем может быть причина?

SelenIT

Дата 12.6.2008, 21:23 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

Leonid1611, а можно минимальный проблемный пример кода? Описанная схема событий, имхо, является классической для реализации drag'n'drop-а на JS, но все виденные мной примеры (в т.ч. с этого форума) как-то работали без такой проблемы. Есть подозрение, что корень зла в другом месте.

В этом div-е, случайно нет картинок или ссылок?

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Ghirik

Дата 12.6.2008, 21:33 (ссылка)

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

Загрузка ...

Опытный

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

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

Цитата

а IE и FF элемент продолжает "тащиться" за мышью, пока снова не сделаешь click.

Сформируйте страничку, я такое наблюдал и от этого избавился...

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

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

Leonid1611

Дата 13.6.2008, 01:48 (ссылка)

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

Загрузка ...

Новичок

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

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

Цитата

Сформируйте страничку

Простите, не понял.

Цитата

В этом div-е, случайно нет картинок или ссылок?

Именно картинки div и содержит.

Код


function startDrag(evnt)
{
    evnt = evnt || window.event; 
    mouseOffset = mousePosition(evnt);
    dragging = true;    
}

function stopDrag(evnt)
{
    dragging = false;
    repaint();
}

 function mouseMove(evnt)
 {
    if (!dragging) return;
    else {
        evnt = evnt || window.event;
        var mousePos = mousePosition(evnt);
        var element;
        for (var i = 0; i<draggableContainer.childNodes.length; i++) // обходим все дочерние узлы
            { 
            element = draggableContainer.childNodes[i];
            if (element.nodeType == 1) { // проверяем является ли элементом
            // если является меняем координаты
                element.style.top = (parseInt(element.style.top) + mousePos.y - mouseOffset.y )+"px";
                element.style.left = (parseInt(element.style.left) + mousePos.x - mouseOffset.x)+"px";              
               }
            }
            CENTER_X -= mousePos.x - mouseOffset.x;
            CENTER_Y -= mousePos.y - mouseOffset.y;
            mouseOffset=mousePos; 
        }    
 }

Ghirik

Дата 13.6.2008, 10:02 (ссылка)

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

Загрузка ...

Опытный

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

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

Цитата

Простите, не понял

Покажите проблему. Выложите код от <html> до </html>. Вам же будет удобнее, мы эту сраничку подредактируем, и обратно выложим.

Вообще, касаемо Dragging методов, мне понравилось вот это решение. Вполне возможно, что качнув архив из указанной мной ссылки, ваши проблемы исчезнут сами сабой.

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

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

Leonid1611

Дата 13.6.2008, 12:29 (ссылка)

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

Загрузка ...

Новичок

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

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

Посмотреть можно здесь

http://vnagp.ru/WebPortal/NovgorodRegion/

Код


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Карта Новгородской области</title>
    <%--<link href="..\agp.css" type="text/css" rel="STYLESHEET" media="all"/>--%>
    <link href="map.css" type="text/css" rel="STYLESHEET" media="all"/>
    

</head>
<body onload = "onLoad()">    
    <form id="form1" runat="server" visible="true">
    <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" EnablePageMethods="true" runat="server">
    <scripts>
        <asp:ScriptReference Path = "MapScripts_new.js"></asp:ScriptReference>        
    </Scripts>
    <Services>
        <asp:ServiceReference Path = "~/MapServices.asmx"></asp:ServiceReference>
    </Services>
    </ajaxToolkit:ToolkitScriptManager>
    
    <div id="mainPanel" class="mainPanel"> 
        <div id="map" class="mapDiv" onmousedown="startDrag(event)" onmousemove="mouseMove(event)" onmouseup="stopDrag(event)" ondblclick="clickZoom(event)" <%--onclick="getCoordinates(event)"--%>></div>
        <div id="zoomControl" class="zoomControl">
            <%--OnTextChanged="javascript:sliderZoom(Slider1_BoundControl.Text)"--%>
            <asp:TextBox ID="Slider1_BoundControl" Enabled="false" AutoPostBack="true" CssClass="sliderBound" runat="server"></asp:TextBox>
            <asp:TextBox ID="Slider1"  CssClass="sliderDiv" runat="server"></asp:TextBox>                     
            <div id="scale" class="scaleDiv">км</div>            
        </div>
        <div id="layers" class="layers"></div>
        <asp:UpdatePanel ID="layersDiv" runat="server">
            </asp:UpdatePanel>        
        <div id="Tools" class="toolsDiv">
            <asp:Panel ID="LayersChoiceHeaderPanel" runat="server" style="cursor: pointer;">
                <div>
                    <asp:ImageButton ID="ToggleImage"   runat="server" ImageUrl="images/collapse.jpg" AlternateText="collapse" Enabled="false" />
                    Выбор отображаемого слоя
                </div>
            </asp:Panel>
            <asp:Panel id="LayersChoicePanel" runat="server" style="overflow:hidden;">
                <%= GetLayersPanelText()%>
                <input type="button" id="LayerButton" value="Показать" name="LayerButton" onclick="getLayers(); return false;" />
                <input type="button" id="GetMapButton" value="Загрузить фрагмент карты" name="GetMapButton" onclick="downloadMap3();" />
            </asp:Panel>
            <asp:Button ID="GetMapButtonTest" runat="server" Text="Загрузить файл" OnClick="GetMapButtonTest_Click" />            
        </div>        
                     
    </div>   
         
        <ajaxToolkit:SliderExtender ID="SliderExtender1" runat="server"
            BehaviorID="Slider1"
            TargetControlID="Slider1"
            BoundControlID="Slider1_BoundControl"
            Orientation="Vertical"
            EnableHandleAnimation="true"
            Minimum="0" Maximum="4" Steps="5" Decimals="0"            
            RaiseChangeOnlyOnMouseUp="true"                       
            TooltipText="2"/>
            
        <ajaxToolkit:CollapsiblePanelExtender ID="cpeDesc" runat="Server"
        TargetControlID="LayersChoicePanel"
        ExpandControlID="LayersChoiceHeaderPanel"
        CollapseControlID="LayersChoiceHeaderPanel"                
        ImageControlID="ToggleImage"         
        ExpandedImage="images/expand.jpg"
        CollapsedImage="images/collapse.jpg" /> 
    </form>
</body>
</html>

Leonid1611

Дата 14.6.2008, 14:45 (ссылка)

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

Загрузка ...

Новичок

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

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

Решение смотреть здесь если кому то еще понадобиться.
Спасибо SelenIT.

Это сообщение отредактировал(а) Leonid1611 - 14.6.2008, 14:45

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