Visualizzazione dei risultati da 1 a 4 su 4
  1. #1
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    4

    [JQuery] show-hide con animazione

    Salve,
    scusate l'ignoranza ma sono agli inizi, abbiate pieta'.
    Allora, premessa: all'interno di un div con posizionamento relativo, ho vari h3, ognuno con 1 div seguente; questi ultimi div partono tutti nascosti tramite jquery.
    Cliccando su h3, quest'ultimo si posiziona al centro, sotto si visualizza div successivo e si nascondono tutti gli altri h3, su click successivo si torna a situazione iniziale.
    per ora ho fatto in questo modo e tutto funziona:

    $("h3").toggle(function(){
    var indexWidth = $('#index').innerWidth();
    var h3NativeWidth = $(this).outerWidth();
    var centering = (indexWidth-h3NativeWidth)/2;
    $(this)
    .animate({'top':0, 'left':centering}, 'fast')
    .addClass("top")
    .siblings()
    .addClass("hidden")
    .end()
    .next()
    .slideDown('slow')
    .fadeIn();
    }, function(){
    $(this)
    .next()
    .slideUp('fast')
    .end()
    .css({'top':'', 'left':''})
    .removeClass("top")
    .siblings()
    .removeClass("hidden");
    });

    esempio html:
    <div id="Index">
    <h3>testo</h3>
    <div>


    asdasdasd</p>
    </div>
    <h3>testo2</h3>
    <div>


    asdasdasd</p>
    </div>
    <h3>testo3</h3>
    <div>


    asdasdasd</p>
    </div>
    </div>

    Prima domanda: ho fatto tutto bene o (sicuramente) si puo' fare meglio?
    Seconda domanda: come faccio su secondo click su h3 a creare un'animazione che muova h3 a sua posizione iniziale?

    Grazie a chiunque voglia rispondere

  2. #2
    Utente di HTML.it L'avatar di Xinod
    Registrato dal
    Sep 2000
    Messaggi
    13,649
    provandolo vedo un' animazione un po' bislacca
    hai un esempio con un po' di css, cosi' da chiarire meglio se se e' voluta?

    per la seconda domanda: l' h3 non mi risulta si sposti, quindi cosa intendi?

  3. #3
    accordion




    Ps.
    benvenuto nel forum
    Without faith, nothing is possible. With it, nothing is impossible
    http://ilwebdifabio.it

  4. #4
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    4
    Mi scuso se non mi sono fatto piu' vivo... problemi di lavoro...
    Allora, prima di tutto grazie per la disponibilita'.

    Originariamente inviato da Xinod
    provandolo vedo un' animazione un po' bislacca
    beh, si, e' proprio bislacca, ma sto cercando di capire come funziona, siate comprensivi.
    cmq ho messo su una demo per far capire meglio:

    demo

    Originariamente inviato da whisher
    accordion
    Si, infatti, ero partito da li'

    Ps.
    benvenuto nel forum
    grazie

    P.S.
    Il sito e' di un mio amico, spero non sembri spam, d'altra parte non vende nulla fa solo arti marziali.
    P.P.S.
    e' possibile con blockUI riuscire ad intercettare un iframe quando viene caricato?

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 © 2025 vBulletin Solutions, Inc. All rights reserved.