1

I have a website with 2 panels. The user can resize these two panel using drag-n-drop.

I want to change the mouse cursor, when the mouse is hovering over the edge of these two panels, to a Resize-Cursor.

However, I've noticed that there are two types of cursor icons for resize (for both vertical and horizontal).

Cursors East-West (aka ew) and North-South (aka ns):

enter image description here enter image description here

Cursors Col and Row:

enter image description here enter image description here

What is the difference between these two pairs of icons, and when should I use each one of them?

Gil Epshtain
  • 939
  • 2
  • 10
  • 15

2 Answers2

2

According to Microsoft Mouse and Pointers documentation,

A screenshot showing the different pointers used for Resizing and Splitting



Behaviours:

Behaviour 1

Dragging the edge increases the size of the two panels combined. The panels' size increases with some defined logic(usually the last panel size like End A or in a proportional way like End B).

Behaviour 1: Dragging the edge increases the size of the two panels combined.



Behaviour 2

Dragging a partition increases the size of the two panels combined.

Behaviour 2: Dragging a partition increases the size of the two panels combined.



Behaviour 3

Dragging a partition changes the sizes of the panels but the panels' combined size remains the same.

Behaviour 3: Dragging a partition changes the sizes of the panels but the panels' combined size remains the same.

Anvesh Dunna
  • 395
  • 2
  • 7
0

Both options are intuitive enough. I would choose first because it is simpler ("less visual noise"). Also second one is usually associated with spreadsheets, that's why the names are Col and Row.

Sergey Kirienko
  • 668
  • 3
  • 7