Deprecated: Return type of Timber\QueryIterator::current() should either be compatible with Iterator::current(): mixed, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 137

Deprecated: Return type of Timber\QueryIterator::next() should either be compatible with Iterator::next(): void, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 150

Deprecated: Return type of Timber\QueryIterator::key() should either be compatible with Iterator::key(): mixed, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 156

Deprecated: Return type of Timber\QueryIterator::valid() should either be compatible with Iterator::valid(): bool, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 133

Deprecated: Return type of Timber\QueryIterator::rewind() should either be compatible with Iterator::rewind(): void, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 152

Deprecated: Return type of Timber\QueryIterator::count() should either be compatible with Countable::count(): int, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/QueryIterator.php on line 202

Deprecated: Return type of Timber\PostsIterator::current() should either be compatible with ArrayIterator::current(): mixed, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/timber/timber/lib/PostsIterator.php on line 12

Deprecated: Return type of Twig\Node\Node::count() should either be compatible with Countable::count(): int, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/twig/twig/src/Node/Node.php on line 161

Deprecated: Return type of Twig\Node\Node::getIterator() should either be compatible with IteratorAggregate::getIterator(): Traversable, or the #[\ReturnTypeWillChange] attribute should be used to temporarily suppress the notice in /srv/roy-showresponse/web/app/themes/showresponse/vendor/twig/twig/src/Node/Node.php on line 166
Go2People website – Show Response
Terug naar overzicht

Go2People website

Automatisering en ICT | Informatieve site, Portofolio site

Hoe te gebruiken

Voor de designers die dit overnemen of aanpassen, let op de groottes van alles! Bij meer dan 20 menu items is dit menu niet geschikt. Houd er rekening mee dat dit ook een menu is met een verborgen CTA.

Technische details

  1. Het zoeken is al eerder uitgewerkt (zie design van Go2People)
  2. Bij klik naar volgende scherm
    • Detail van het middelste streepje niet vergeten
  3. Bij klik op het logo, verschuiven naar rechts net zoals op desktop
  4. Van hamburger menu naar een kruis animeren met ease-in-out 0.7s
  5. Dit is de active menu item
  6. Het pijltje gaat 10px naar rechts bij klik
    • Animeer 0.7s bounce
  7. Menu schuift in vanaf rechts
    • 1.2s ease-in-out
    • Content links krijgt een vlak van 70% zwart
      • Klikken op dit vlak sluit het menu ook
    • Overlay menu = 80% gevuld
  8. Het pijltje in de knop gaat 10px naar rechts bij klik
    • Animeer 0.7s bounce

Oplossingen van andere