it-swarm-eu.dev

Vizuální označení, že web podporuje drag and drop?

Vytvářím systém, který vyžaduje nahrávání souborů, a zajímalo by mě, jak mohu naznačit, že okna prohlížeče podporují přetažení. Vzhledem k tomu, že tato funkce je v moderních prohlížečích nová, neexistuje žádná očekávání uživatelů.

Přemýšlel jsem o tom:

[UPLOAD BUTTON]

|---------------------------|
|--Drag files here----------|
|---------------------------|
|---------------------------|

s barevným efektem na oblast přetažení, ale to se zdá být pouze nezákonné. Mohl bych tooltip tlačítko upload, ale to by mohlo být nepříjemné, pokud se objeví příliš rychle, a to by mohlo být k ničemu, pokud se nezdá dostatečně rychle.

Myšlenky?

6
Stefan Kendall

Krabice s tečkovanou čarou by mohla být dobrým znakem toho, že lze soubory přetáhnout a odeslat. „Přetáhněte soubory sem“, jak jste zmínil, je pravděpodobně také velmi užitečné. Box.net něco podobného dělá pro hromadné nahrávání a možná budete chtít podívat na pluload jquery pluginu: http://www.plupload.com/example_queuewidget.php

Box.net Drag Drop Upload

9
Geert

Imgur to dělá pomocí tlačítka „upload file“ a textem, který říká drag and drop. Gmail a Outlook 2011 pro Mac to dělají stejným způsobem - při přetažení souboru poskytují obrys nebo jinou barvu pozadí/ohraničení.

Myslím, že tečkovaná čára nebo hranice/bg změna je v současnosti nejběžnějším vzorem. Nejsem si jistý, jak to uživatelům umožní vizuálně vědět, že by měli přetáhnout (vs pomocí tlačítka upload), ale jakmile to zkusí/omylem si to, vzor se zdá být konzistentní.

1
Elyse Holladay

S textem bych šel jen jako první krok. Dalo by se přidat, odkud by lidé měli soubory přetahovat. Například: „Sem přetáhněte soubory z plochy“.

Nápovědu lze skrýt v prohlížečích, které tuto funkci nepodporují.

Změna barvy aktivní oblasti funguje dobře. G. v Google Mail. Když uživatel již má k myši připojen soubor.

                                           .
                                 Drop the file(s) here
                                           .
0
erikrojo