خرید بک لینک

درباره سایت

CodingForums

آخرین مطالب

امکانات وب

Dragging panel element with drag zone set.

I have a panel generated with dom methods.

It is set for the user to drag the panel when it showing.

I want to limit the area of the panel where a mouse click will
initiate the drag feature.

So far what I have only works when the window has not been
scrolled. There is a button in an area of the page that the user
has to scroll to to see and click. It displays the panel.

Without the drag zone limit the panel can be dragged anywhere
in the window.

I don't have a hosting service at present, so my site is off line.
Otherwise I would provide a link to a demo.

Here is the code that determines where the mouse can be to drag

specific code is between // <<<< marks.
Code:
var drag = function(target, e)
              {
              var go = false;
              if(target)
                {
                  if(dragZone['set']) // <<<<
                    {
                    if(
                        e.clientX > (target.offsetLeft + dragZone.xmin)
                        &&
                        e.clientY > (target.offsetTop + dragZone.ymin)
                        &&
                        e.clientX < (target.offsetWidth + dragZone.xmax)
                        &&
                        e.clientY < (target.offsetHeight + 12 + dragZone.ymax)
                      )
                      {
                        go = true;
                      }
                    } // <<<<
                  else
                    {
                    go = true;
                    }
                  if(go)
                    {
                    var deltaX = e.clientX - parseInt(target.style.left);
                    var deltaY = e.clientY - parseInt(target.style.top);
                    if(document.addEventListener)
                      {
                        target.addEventListener("mousemove", function(e){ moveHandler(target, e, deltaX, deltaY)}, true);
                        target.addEventListener("mouseup", function(e){ upHandler(target, e)}, true);
                      }
                    if(e.stopPropagation)
                      {
                        e.stopPropagation();
                      }
                    else
                      {
                        e.cancelBubble = true;
                      }
                    if(e.preventDefault)
                      {
                        e.preventDefault();
                      }
                    else
                      {
                        e.returnValue = false;
                      }
                    dragging = true;
                    }
                }
              else
                {
                  return false;
                }
              }
the values for dragZone.xmin, dragZone.xmax, dragZone.ymin and dragZone.ymax
are derived from a child element of the panel element itself.

The element tit ( in code below) is the title bar near the top of the panel.
Somehow the values do not correspond when the window has been scrolled.

Any thoughts on how to do this?

Code:
// ... element creation code
if(dragFeature === true)
  {
  drag.setZone({ 'xmin':tit.offsetLeft, 'ymin':tit.offsetTop, 'xmax':tit.offsetWidth, 'ymax':tit.offsetHeight})
  drag.start({'id':'fractConv'});
  }
// ... etc ...

برچسب: نویسنده: آیلین رضوانی تاريخ: سه شنبه 19 دی 1396 ساعت: 17:24

صفحه بندی

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه