Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    Realizzare effetto apparizione div da sx verso dx

    Salve, di seguito vi indico un sito:
    https://www.gucci.com/it/it/

    Nella versione mobile, al clic delle tre lineette del menù appare da sinistra verso destra il div specifico. Non so se lato css un effetto simile si possa ottenere, penso sia più lato javascript.

    Attendo vostre indicazioni, grazie.

  2. #2
    Non è che appare un div ma è l'intero menu che appare. Questo si può al limite ottenere anche con css ma in gerere è realizzato con js e questo fa parte della programmazione responsive
    “Che le cose siano cosi, non vuol dire che debbano andare così. Solo che quando si tratta di rimboccarsi le maniche e incominciare a cambiare, vi è un prezzo da pagare. Ed è allora che la stragrande maggioranza preferisce lamentarsi più che fare”.

    Giovanni Falcone

  3. #3
    Grazie, puoi darmi qualche info per realizzare un effetto simile?

  4. #4
    Utente di HTML.it
    Registrato dal
    Jan 2016
    Messaggi
    14
    Ciao Dario. Per prima cosa devi fare una media query nel codice css, nascondendo gli elementi che non vuoi che si vedano nella versione mobile, ad esempio il menu nella versione desktop:

    @media screen and (min-width: 480px) {
    #menuversionedesktop{display:none;}
    }

    Personalmente poi faccio apparire un'immagine con le tre linee nella media query.

    #immaginelinee{display:block;}

    Quindi ricapitolando. Con schermi di grandezza minima 480px, hai nascosto il menu normale ed hai fatto apparire un'immagine. A questa immagine dovrai applicare una funzione js al click di questo tipo:
    $("#menuresponsive").slideDown();
    Quando cliccherai l'immagine, scendera il menuresponsive che avrai settato prima come disply:none.

    Ricapitolando. Nascondi menu normale e appare immagine con linee. Quando cliccherai su quest'immagine, scenderà il div (precedentemente settato con display:none del menu responsive. Se non ti è chiaro qualcosa dimmelo.

  5. #5
    Frontend samurai L'avatar di fcaldera
    Registrato dal
    Feb 2003
    Messaggi
    12,925
    in genere il solo evento di click del menu mobile viene gestito via JS che fa il toggle di una classe all'elemento di root
    in base alla presenza di questa classe il menu può essere visualizzato ed animato tramite CSS
    ISSlive , un bot per Telegram per trovare tutti i passaggi visibili della Stazione Spaziale Internazionale.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.