Page "dépliable"

par bigmiches Dim 19 Fév 2017 - 11:36

Bonjour à tous,

je n'ai pas le terme technique, mais je voulais savoir s'il était possible de réaliser une page "dépliable" : par exemple avec des années, qui, lorsque l'on cliquerait dessus ferait apparaitre, sur la même page, du contenu (que l'on pourrait "replier" pour plus de lisibilité.) On peut faire des boutons qui likent vers des pages invisibles pour contourner cela, mais je voulais savoir si c'était possible de réaliser cela sur une même page
je ne sais pas si je suis bien clair...
merci pour votre aide !

par **FredVig** Dim 19 Fév 2017 - 11:48

Bonjour. Oui cela peut être réalisé à partir de codes. Il me semble qu'on peut trouver quelques exemples dans ce forum en cherchant "spoiler". Si vous maitrisez le html, vous pouvez regarder des sites comme coderops un site parmi des milliers qui proposent des tutos de contenus interactif animés. Vous pouvez aussi "embaucher" un Jimdo expert pour réaliser ces contenus. il pourra mieux tenir compte des spécificités de Jimdo.
Enfin, vous pouvez poster vos essais dans la catégorie "modifier le Head" de ce forum (j'ai déplacé votre post dans cette catégorie). Si vous entreprenez une modification de code, nous pouvons vous guider dans vos recherches.

par bigmiches Dim 19 Fév 2017 - 11:50

Merci pour votre réponse rapide, je vais faire des recherches avec la notion de spoiler effectivement, je n'y avais pas pensé, mais c'est bien le résultat espéré, à plus grande échelle.

par **FredVig** Dim 19 Fév 2017 - 11:51

Sur coderops ils classent cela en "multi-layers page" : https://tympanus.net/codrops/2016/06/01/multi-layer-page-reveal-effects/

par **FredVig** Dim 19 Fév 2017 - 12:08

Les "moteurs" de base pour de telles interactions sont assez simples.
Les boutons animés en sont une application.
Vous avez un exemple de coderops traduit en français sur mon site : https://www.fredvig.com/boutons-rollover/
Le principe est de mettre dans un widget html deux div imbriquées, l'une masquant l'autre. Les divs sont décalées l'une par rapport à l'autre. AU survol, certaines propriétés des div changent, leur position, leur aspect… Comme elles sont affectées par les propriétés transition transform et delay, ces changements s'effectuent progressivement, donnant l'impression d'un mouvement.
L'animation est déclenchée par un survol (:hover)
elle peut être modifiée en :click

Il existe de nombreuses façon de parvenir à de tels résultats. Cette méthode a l'avantage de ne faire appel qu'à du CSS et du code html. Les propriétés fonctionnent plutôt bien sur de nombreux navigateurs.

par bigmiches Dim 19 Fév 2017 - 12:12

Super merci, je vais regarder. Je ne sais pas si j'ai les connaissances techniques pour suivre cela, mais je vais regarder. Le survol n'est pas utilisable car les blocs qui apparaissent peuvent aussi être des liens (vidéos, etc) mais le changement en :click à tenter... merci

par **FredVig** Dim 19 Fév 2017 - 13:17

C'est à la fois simple et demande des connaissances pour comprendre ce que l'on fait, comment "ça" fonctionne. Mais vous ne risquez rien à essayer de comprendre, tester des codes etc…

par bigmiches Lun 20 Fév 2017 - 12:20

Pas de souci, je n'ai pas peur de me lancer. Juste un manque de temps parfois mais ça va le faire Wink

Merci encore

par Contenu sponsorisé

Page "dépliable"

Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"

Re: Page "dépliable"