it-swarm.com.de

Verschiebbarer pfadbasierter Brotkrumen

Ich möchte einen pfadbasierten Breadcrumb mit reinem CSS erstellen und überlege, ihn zu verschieben, wenn der Pfad zu lang ist.

Zum Beispiel:

path 1 > path 2 > path 3 > .......... > path n

Wenn der Semmelbrösel zu lang ist, um in einer einzelnen Zeile angezeigt zu werden. Wäre dies ein intuitiver Breadcrumb, der implementiert werden muss?

Der Nachteil dieses Ansatzes bedeutet, dass Pfad 1 und Pfad 2 ausgeblendet werden können, wenn der Benutzer den Cursor auf Pfad n bewegt.

2
freak

Ich kenne das jeweilige Szenario nicht, aber wenn der Breadcrumb zu lang ist, um in einer einzelnen Zeile angezeigt zu werden, gibt es bereits zu viele Informationen, um die sich der Benutzer kümmern könnte, und Sie sollten in Betracht ziehen, die Anzeige zu vereinfachen, ohne es zu versuchen um einen Weg zu finden, mehr Informationen als nötig in einen Raum zu pressen, der nicht groß genug ist, um sie aufzunehmen.

Durch Hinzufügen von Schiebefunktionen würden Sie einen Mechanismus überkomplizieren, der nur als Hilfe neben der primären Navigationsstruktur dienen soll.

Ein häufiger Grund dafür, dass Breadcrumbs sehr lang werden, ist, dass der Text für die Elemente aus einer Quelle stammt, die niemals für Breadcrumbs entwickelt wurde, z. B. die Titel für Seiten oder die facettierte Navigation oder die primäre Navigation selbst, einschließlich Mega-Dropdowns.

Ich würde wirklich empfehlen, das Problem zu beseitigen, anstatt sich um die Einbeziehung des Problems zu bemühen, denn dann haben Sie zwei Probleme.

3
Roger Attrill

Wenn der Effekt korrekt implementiert wird, ohne die Benutzer zu sehr abzulenken, kann dies intuitiv erfolgen. Es gibt viele Beispiele, die Sie sich ansehen könnten, wenn Sie JQuery Breadcrumbs googeln - nur um den Effekt zu sehen.

Eines, das besonders in den Sinn kommt, ist xBreadcrumbs. Schauen Sie sich Beispiel 2 an, wenn Sie mit der Maus über einen der leicht versteckten Semmelbrösel fahren.

Demobeispiel 2: http://www.ajaxblender.com/script-sources/xbreadcrumbs/demo/index.html

0
Adriaan