funny (not haha) ondrag/onmousedown behavior

G

Giggle Girl

Hi there!
I am trying to get a web app for our intranet (IE 6+ only) to have a
similar behavior to MS Excel, where you can "drag" in between Column
Headers to resize them.

See an online demo at:

http://s161149005.onlinehome.us/DEMOS/XL_1/main/example_01.htm

It works, but it is glitchy. Specifically, there are two problems:

1. because you are dragging with mousedown, text from the page gets
highlighted intermittantly
2. onmousedown with a drag "misfires" somtimes

For number one, it is annoying when you are dragging a header edge, and
blue "highlighted" text from the table underneath flashes on and off...
can I disable this "feature" somehow?

For the second item, sometimes when you click and drag the edge of a
header, it works as intended. But about 50% of the time, the drag
begins, but after a few pixels "shuts down", displaying the "Not
Permitted" "Slashed Circle" thingy, and you have to release the button,
at which point you can "drag and drop" but without the mouse held down.
Not what I want at all!

Anyone have any ideas on how to resolve these issues?

Thanks,
Ann
 
G

Giggle Girl

Giggle said:
Hi there!
I am trying to get a web app for our intranet (IE 6+ only) to have a
similar behavior to MS Excel, where you can "drag" in between Column
Headers to resize them.

See an online demo at:

http://s161149005.onlinehome.us/DEMOS/XL_1/main/example_01.htm

It works, but it is glitchy. Specifically, there are two problems:

1. because you are dragging with mousedown, text from the page gets
highlighted intermittantly
2. onmousedown with a drag "misfires" somtimes

For number one, it is annoying when you are dragging a header edge, and
blue "highlighted" text from the table underneath flashes on and off...
can I disable this "feature" somehow?

For the second item, sometimes when you click and drag the edge of a
header, it works as intended. But about 50% of the time, the drag
begins, but after a few pixels "shuts down", displaying the "Not
Permitted" "Slashed Circle" thingy, and you have to release the button,
at which point you can "drag and drop" but without the mouse held down.
Not what I want at all!

Anyone have any ideas on how to resolve these issues?

Thanks,
Ann

I just wanted to add a thing or two...

First, I did experiment with other event handlers, like IE's
"ondragstart"... couldn't get it to work for my purposes.

Also, at the bottom of the demo is a link to a 2nd version, which is
identical but uses "onclick" instead of "onmousedown". There is no
blue highlighting or glitchy dragging, BUT! -- it is not the way that
MS Excel operates, so users here will get confused.

I really want the normal "drag and drop" functionality, where you
click-and-hold, drag where you want, _THEN_ release!

Thanks,
Ann
 
T

tim

Giggle said:
Hi there!
I am trying to get a web app for our intranet (IE 6+ only) to have a
similar behavior to MS Excel, where you can "drag" in between Column
Headers to resize them.

See an online demo at:

http://s161149005.onlinehome.us/DEMOS/XL_1/main/example_01.htm

It works, but it is glitchy. Specifically, there are two problems:

1. because you are dragging with mousedown, text from the page gets
highlighted intermittantly
2. onmousedown with a drag "misfires" somtimes

Hello there

I've come across the same problems trying to drag/click in IE6.

The problem seemed to be dragging an img ( possibly clicking in padding
space as well ). Tried replacing the imgs with <div class="sep_img">
and set the css background for sep_img.

There were fewer circles but only a minor improvement in the
highlighting problem.

Worked better with padding:0px and width:5px for TABLE.Excel_Cols
TD.separator, and width:5px for the sep_img class.

No more circles, occasional highlighting, but by removing the padding
the seperator can be dragged all the way to the next one on the right
which triggers an error.

Hope this helps

Tim
 
G

Giggle Girl

Hello there
I've come across the same problems trying to drag/click in IE6.

The problem seemed to be dragging an img ( possibly clicking in padding
space as well ). Tried replacing the imgs with <div class="sep_img">
and set the css background for sep_img.

There were fewer circles but only a minor improvement in the
highlighting problem.

Worked better with padding:0px and width:5px for TABLE.Excel_Cols
TD.separator, and width:5px for the sep_img class.

No more circles, occasional highlighting, but by removing the padding
the seperator can be dragged all the way to the next one on the right
which triggers an error.

Hope this helps

Tim

Hey Tim,
thanks for the advice.

I did a new version which is much better here (IE 6+ only):

http://s161149005.onlinehome.us/DEMOS/XL_2/main/example_01e.htm

* I have turned "on" the dividers/pipes by making their background
orange for demo purposes...

I used DIVs with a background image, increased the size of the "pipe"
(5 px, with 2 px transparency on either side) and made a couple other
tweaks...

Working much better now.

One new issue is that sometimes when you grab a pipe to drag, a
different one sometimes disappears, seemingly at random, and for only a
moment.

Anyway, if people still have advice or suggestions to make this better,
I am open to all input.

Thanks so much,
Ann
 
G

Giggle Girl

Mac and FF? Wow!

It is not working on my PC running FF... I wish we did stuff for
Firefox here (it is what I use personally), but for these Intranet apps
they don't want me "wasting cycles" on it... :(

Anyway, thanks for the input, ASM, and I am checking out the link, too!

Ann
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,007
Latest member
obedient dusk

Latest Threads

Top