Visualizzazione risultati 1 fino 19 di 19

Discussione: Div a scomparsa SENZA spostare la pagina!

  1. #1
    Guest

    Predefinito Div a scomparsa SENZA spostare la pagina!

    ciao a tutti.
    uso da un pò di tempo questo script per nascondere/mostrare un tag div:

    Codice HTML:
    <script type="text/javascript">
    <!--
    function scambio(id){
    	if (document.getElementById){
    		if(document.getElementById(id).style.display == 'none'){
    			document.getElementById(id).style.display = 'block';
    			} else {
    			document.getElementById(id).style.display = 'none';
    		}
    	}
    }
    -->
    </script>
    e come link per richiamarlo:

    Codice HTML:
    <a href="#" onclick="scambio('id_div')">
    il problema è che ogni volta che clicco sul link la pagina è come se si refreshasse e riappare dall'inizio senza mantenere la posizione attuale al momento del click.

    come posso fare?

    grazie.

  2. #2
    Guest

    Predefinito

    Accade perchè l'indirizzo del link è un'ancora, infatti le ancore sono identificate con #nomeancora.
    Non trovando nessuna ancora con quel nome (infatti non c'è nessun nome) la pagina scrolla a coordinate 0,0.

    Modifica così:

    <a href="javascript:scambio('id_div')">


    Ciaooo!!!11

  3. #3
    Guest

    Predefinito

    grazie ora va che è un piacere :)

  4. #4
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

    Predefinito

    si, però adesso è male - non si dovrebbe usare javascript: nell'href. E la soluzione corretta in effetti è molto più facile Se il codice javascript in onclick restituisce false, la redirezione dell'href non viene effettuata.

    Quindi puoi usare una cosa del genere:
    Codice:
    <a href="#" onclick="scambio('id_div'); return false;">
    o return scambio(...), e scambio ritorna false :-)

    edit: invece di #, volendo essere proprio tignosi, pignoli e accessibili, ci vorrebbe un link ad una pagina, che fornisca a chi non ha javascript [attivo] lo stesso risultato di scambio().

    edit2: uh, io l'ho scoperto pochi giorni fa', ma per le ancora adesso non serve piu' usare name= bla bla, ma basta l'attributo id. Mi ha reso molto felice
    Ultima modifica di dreadnaut : 04-03-2007 alle ore 19.56.52

  5. #5
    Guest

    Predefinito

    Citazione Originalmente inviato da dreadnaut
    si, però adesso è male ...

    Quindi puoi usare una cosa del genere...

    edit: ...

    edit2: ...
    Ma tu non c'hai niente da fare?!?




    Ciaoo!!!!!!!!

  6. #6
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

    Predefinito

    whops, non lo faccio più, prometto !

  7. #7
    Guest

    Predefinito

    io però non ho capito piu un cavolo!

  8. #8
    L'avatar di funcool
    funcool non è connesso Utente storico
    Data registrazione
    05-02-2004
    Residenza
    Qui... Non lì, qui!
    Messaggi
    15,433

    Predefinito

    Al posto di:
    Codice HTML:
    <a href="#" onclick="scambio('id_div')">
    Metti:
    Codice HTML:
    <a href="#" onclick="scambio('id_div'); return false;">
    Mattia vi manda a FunCool - Matriz - Directory Gogol - Sfondo rosso per la Birmania
    «Tu mi dai fastidio perché ti credi tanto un Dio!» «Bè, dovrò pur prendere un modello a cui ispirarmi, no?» Woody Allen

  9. #9
    Guest

    Predefinito

    che infatti mi sa che fosse la configurazione originale trovata secoli fa e poi perduta causa molteplici copia/incolla...
    ma con il return false si risolve il problema dello scrolling?

  10. #10
    L'avatar di funcool
    funcool non è connesso Utente storico
    Data registrazione
    05-02-2004
    Residenza
    Qui... Non lì, qui!
    Messaggi
    15,433

    Predefinito

    Citazione Originalmente inviato da lsdforum
    ma con il return false si risolve il problema dello scrolling?
    Sì, perché non esegue quello che c'è scritto in href.
    Mattia vi manda a FunCool - Matriz - Directory Gogol - Sfondo rosso per la Birmania
    «Tu mi dai fastidio perché ti credi tanto un Dio!» «Bè, dovrò pur prendere un modello a cui ispirarmi, no?» Woody Allen

  11. #11
    Guest

    Predefinito

    OK, grazie mille.
    vado a rimodificare tutti i file allora ^^

  12. #12
    L'avatar di heracleum
    heracleum non è connesso Utente storico
    Data registrazione
    21-01-2004
    Messaggi
    3,333

    Predefinito

    Mia personale preferenza (perché anche più compatta come soluzione) è la variante senza un return false esplicito, ovvero:

    <a href="#" onclick="return scambio('id_div');">

    Che però ovviamente richiede che alla fine della function scambio, l'ultima riga sia "return false;"
    riscrivendo tutta la fuction (anche ottimizzandola un po' ) ecco il codice adatto:

    Codice:
    <script type="text/javascript">
    <!-- 
    function scambio(id){ 
     if (document.getElementById){
      var elem = document.getElementById(id);
      elem.style.display = (elem.style.display == 'none')? 'block' : 'none';
     }
     return false;
    } 
    -->
    </script>
    Come vedi, oltre a ritornare false alla fine, evita di fare più volte il getElementById facendolo una volta sola, meglio no?
    ciao
    Avvertimento: richiedere in privato questioni tecniche produrrà inevitabilmente una supercazzola prematurata come risposta. (5 served)

  13. #13
    Guest

    Predefinito

    non so dirti se sia meglio o peggio, di javascript non ci ho mai capito una mazza :)

    cmq grazie a tutti per le risposte esaustive!

  14. #14
    Guest

    Predefinito

    Metti :
    <a href="javascript:void(0)" onclick="scambio('id_div')">

    Ecco la differernza :
    È un modo per scrivere un link "vuoto" e molto spesso equivale a <a href="#">, con la differenza che il # fa puntare il browser in alto nella pagina. Infatti se ci troviamo in una pagina molto lunga vedremo che dopo il click su <a href="#"> il browser punta in alto.

    La sintassi void(0) invece non fa nulla e non produce alcun effetto.

    Spesso è un modo per individuare un link che non punta a una pagina particolare, ma che per qualche motivo dobbiamo utilizzare come <a>.

    (preso da un sito web)

    :)
    Ultima modifica di comunitavirtuali : 05-03-2007 alle ore 21.29.22

  15. #15
    Guest

    Predefinito

    che si ottiene con void(0) ??

  16. #16
    L'avatar di dreadnaut
    dreadnaut non è connesso Super Moderatore
    Data registrazione
    22-02-2004
    Messaggi
    6,306

    Predefinito

    Citazione Originalmente inviato da comunitavirtuali
    Metti :
    <a href="javascript:void(0)" onclick="scambio('id_div')">
    uff... no, niente javascript nel campo href

  17. #17
    Guest

    Predefinito

    Citazione Originalmente inviato da comunitavirtuali
    La sintassi void(0) invece non fa nulla e non produce alcun effetto.
    ma come scritto sopra meglio non mettere href=javascript:blablabla, meglio usi il return false, ciao!

  18. #18
    L'avatar di heracleum
    heracleum non è connesso Utente storico
    Data registrazione
    21-01-2004
    Messaggi
    3,333

    Predefinito

    il javascript:void(0) nell'href mi è sempre sembrata la soluzione peggiore sinceramente

    poi è ovvio che quando sopra suggerivo:
    <a href="#" onclick="return scambio('id_div');">

    è sempre un milione di volte più corretto (per l'accessibilità a cui si è sempre più sensibili oggi) mettere nell'href un indirizzo che -pur facendo una richiesta al server- crei lo stesso effetto che genera il javascript, come giustamente suggerito da dreadnut. Per esempio in questo caso, se lo script è "index.php" che di default mostra tutti i div nascosti, dovrebbe accettare in querystring un parametro che indichi quale div sia mostrato, per es:
    <a href="index.php?id_div=1" onclick="return scambio('id_div');">

    così è la situazione migliore per eccellenza... buona oltre che per l'accessibilità, per chi è maniaco di trascinamenti di link in altri tab. Per fare un esempio che avete sotto agli occhi se cliccate in testa al forum sulla voce "Cerca" c'è registrato un evento javascript che fa aprire la tendina... ma se guardate il codice c'è un semplice href impostato, questo viene sovrascritto per priorità dall'evento js ma ad ogni modo, per chi non avesse javascript attivo sarebbe un semplice link alla pagina di ricerca avanzata, stessa cosa se trascinate il link Cerca in un altro tab (firefox / ie7).

    Ma c'è anche da dire che -da quanto mi sembra di capire- stiamo fin troppo filosofeggiando rispetto alle semplici richieste di lsdforum ;)
    Avvertimento: richiedere in privato questioni tecniche produrrà inevitabilmente una supercazzola prematurata come risposta. (5 served)

  19. #19
    Guest

    Predefinito

    beh si, forse stiamo raggiungendo un livello eccessivamente approfondito per uno script molto semplice il cui scopo è dare un tocco un pò più dinamico/fighetto ad una pagina.

    quando metto online il sito vi sfiderò a trovare il luogo dove è stato usato! :)

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •