Accordion Test per collegare alle Ancore

[Kris]

Ciao a tutti!
1. C'e un modo di variare questo codice per permettere di linkare ( in modo, che quando viene cliccato  il 1° si apra il "mascc1",  il 2° link apra il "msacc2", il 3° link apra il "msacc3" e cosi via...)     http://quellidelcucuzzolo.blogspot.com/2016/04/effetto-accordion-oggetti-website-x5.html?showComment=1549759591349#c5302183671231121919 ,
2. Oltre questo, c'e la possibiltià in quel codice inserire che la riga "msacc1" rimane sempre aperta?

Grazie dell'aiuto.Buona domenica a tutti!Kris

[lemonsong]

Ho capito poco, ma se la prima domanda è uguale a questo commento (blog linkato) del 10 aprile, 2018:

Se io volessi inserire un link che rimanda a un oggetto ancorato (msacc01, per esempio) all'interno della pagina in cui ho inserito l'accordion, c'è modo di far si che venga visualizzato l'oggetto già "aperto"?

... la risposta è stata data:

Potresti aggiungere uno script utilizzando il metodo .trigger() insieme all'evento click per simulare appunto l'apertura dell'oggetto con accordion quando si clicca sul relativo link.

Se ho indovinato, questa è una traduzione di massima:

$('idOggetto a').click(function(){
      $('idTitoloOggetto').trigger('click');
  });

Ovviamente va dinamicizzato e magari ritardare (setTimeout) l'apertura dell'oggetto dopo il click sul link.


Per quanto riguarda la seconda domanda (sempre se ho capito): all'oggetto in questione non assegni l'ancora (o non usi il prefisso msacc)... non ti va bene? 
La formattazione degli stili etc... la fai da programma.


Se ho capito male, prova a riformulare le domande magari con un link e screenshot o aspetti qualcuno meno addormentato di me.

[Kris]

Ciao,
Grazie per il codice. Provato , ma qualcosa non funziona, no.

Cerchero di spiegare meglio... sulla pagina ho inserito questi codici (l'accoridon funziona alla grande, da tempo che lo conosco questo script)

<script src="js/jquery-ui-effect.min.js"></script>
<script>
/* ==============================================================
Accordion Object: versione collapse all v.17
Author's custom code: http://quellidelcucuzzolo.blogspot.it
Please do not remove credit
============================================================== */
$(document).ready(function() {
  $("div[id^='msacc']").parent().addClass("msaccordion");
  $(".msaccordion div[id^='imCellStyleTitle_']   div, .msaccordion div[id^='imCellStyleDescription']").css("display", "none");
  $(".msaccordion div[id^='imCellStyleTitle_']").each(function() {
    $(this).prepend("<span class='symFaq'>  </span>"); //simbolo grafico pannello chiuso
    $(this).parent().css("min-height", $(this).outerHeight(true));
  });
  $(".msaccordion div[id^='imCellStyleTitle_']").click(function() {
    var $this = $(this);
    var $opentab = $(".msaccordion div[id^='imCellStyleTitle_']   div:visible");
    $opentab.prev().nextAll().hide("blind", 500, function() { //effetti UI consigliati: blind, drop, fade, slide
      $opentab.prev().css("background-color", "#72207A").find("span").html("  ") //colore background e simbolo grafico pannello chiuso
    });
    if ($this.next().is(":hidden")) {
      $this.nextAll().show("blind", 500); //effetti UI consigliati: blind, drop, fade, slide
      $this.css("background-color", "#97CD5C").find("span").html("– "); //colore background e simbolo grafico pannello aperto
    }
  });
});
</script>
<scrip>
   $('imCellStyleTitle_58_').click(function(){
      $('Mi az energetikai tanúsítvány?').trigger('click');
});
</scrip>
adesso ho aggiunto questo che mi avevi dato, modificando in questo modo

<scrip>
   $('imCellStyleTitle_58 a').click(function(){
      $('Mi az energetikai tanúsítvány?').trigger('click');
});
</scrip>
Poi ho inserito un link nel footer "Mi az energetikai tanúsítvány?".

Inserito il codice in uno script , ma la prima voce  "Mi az energetikai tanúsítvány?" nell'accoridon test rimane chiusa. :-( Dove sbaglio?
ecco il link provvisorio
https://tanusitvany-kecskemet.hu/1/
Come vedi nel footer ci sono altre 5 link, di cui 4 vorrei collegare al accordion menu.
Mi az energetikai tanúsítvány? -> collegando al msacc1,Mikor kötelező az energetikai tanúsítvány? -> collegando al msacc2, ... e cosi via. Importante, che il   diventi - (quindi vinega visualizzato aperto il testo, rispettivoal link cliccato)

Spero che ora è più giusta la descrizione
Grazie

[lemonsong]

Dove sbaglio?

Preferirei non rispondere a questa domanda.

Quel codice che ho postato era solo un "accenno", tanto per dare un input, ma... vabbè.

Adesso non ho più tempo, ma tanto per dirne solo una: anche se non serviva riscriverli, guarda come hai scritto i tag script

Se ho tempo più tardi o nei prossimi giorni proverò, dopo un paio di litri di camomilla, a rispondere più dettagliatamente a questo post.

Lascia l'esempio online!


 

[Kris]

non so porgrammare ;-( ma va bene lo stesso. rimane cosi se ti innervosisce lascia perdere. volevo solo quello che chiedeva un altro utente sul cuccozzolo. ma non c'e risposta.
quando avrai voglia con tanta camomilla, grazie ciao

[lemonsong]

Rispondo senza quotare per fare prima (forse).

Ho capito che non sai programmare (anche io non sono un programmatore), ma sono anni che leggi e usi codici più o meno complessi e un minimo di dimestichezza ormai dovresti averla acquisita. Se mi innervosisco è anche per questo motivo. "Nessuno nasce imparato", recita un modo di dire; tutti, ripeto tutti, abbiamo sempre qualcosa da imparare e visto che non gestisci solo il tuo sito, ma offri servizi che si basano sulla "programmazione web" (anche se fa tutto WS), la curiosità dovrebbe spingerti oltre i famosi 5 step di casa Incomedia e approfondire quello che "copi e incolli".

Bene, dopo la predica, arriva un altro malloppone.

Premesso che quello che vuoi ottenere forse confonde il navigatore, QUI ho preparato un esempio fatto con la versione Demo della 2020.2.4

Lo script accordion utilizzato è però quello "base" (un oggetto rimane "aperto" se ne apriamo un altro), perché con l'altro, per renderlo pienamente funzionante,forse occorreva spenderci altro tempo. Passo volentieri la mano a chi volesse intervenire a riguardo.

Ho deciso di separare il nuovo script per evitare pasticci e, soprattutto, per praticità.

Per risparmiare camomilla  posto qui il codice:

<!-- Proprietà pagina - Esperto - Prima della chiusura del tag BODY -->
<script>
var links = $('#imTextObject_05 a'); //id oggetto con links con ancora accordion

links.each(function() {
  var ancora = $(this).attr('href').split('#msacc');
  $(this).click(function() {
    var titolo = $('#msacc' + ancora[1]).siblings('div[id^="imCellStyleTitle_"]');
    if (titolo.next().is(":hidden")) {
      setTimeout(function() {
        titolo.trigger('click');
      }, 500); //tempo in millisecondi per ritardare l'apertura dell'oggetto
    }
  });
});
</script>

 

Sicuramente si poteva scrivere meglio, ma questo è quello che è venuto fuori.

Per chi avesse, come nel tuo caso, la sticky bar attivata (con altezza costante a tutte le risoluzioni) e visibile nel punto dove sono gli oggetti accordion (dato relativo) bisogna inserire, insieme alle altre, anche questa regola CSS per compensare la posizione dell'id ancora.
Si poteva dinamicizzare pure questo, ma ho preferito lasciare questo valore "manuale":

div[id^="msacc"] {
    margin-top:-40px; /* altezza sticky bar */
}

Per dubbi o altro, c'è sempre il sorgente della pagina.


Ecco, come quasi sempre ho speso più tempo a scrivere il post che lo script, ma mi illudo sempre che valga la pena di tentare di essere più chiari possibile.

[Kris]

Grazie Lemon per lo script, cerchero di capire come inserire in quello che sta online, con chiusura quelli letti perchè quello che volevo, collegando ai link.

Meno grazie per le prediche, mi stavando dando troppo anche i miei genitori ed ora non mi sevre proprio.
Io propongo col ws solo quello che riesco a farlo. Col disegno vado meglio che con gli script ;-) ciao

[lemonsong]

Non c'è niente da capire se vuoi provare il nuovo script con quello (accordion) che hai sul sito. L'ho separato proprio per questo motivo.
Ma, come ho già detto, non è pienamente funzionante etc...

Io propongo col ws solo quello che riesco a farlo.

Questa è una bugia, altrimenti useresti l'accordion di WS e non chiederesti codici per fare questo e quello. Scusa, ma me l'hai servita su di un piatto d'argento.     

Per quanto riguarda le prediche, anche a me danno molto fastidio quando le ricevo, l'importante è non essere offensivi e spero di non esserlo stato.

[Kris]

Scusa ma quello di ws mica si collega ai link, per cui non sarebbe possibile ad usarlo.
Ho inserito insieme a quel script questi nuovi , ma ci sarà qualche errore nel insieme perchè non si apre per ora.
Speriamo che capiro , dove sta l'errore , per una mancanza o assegnazione di qualcosa.
Grazie lo stesso.

Mi sembri incavolato , eppure non ho detto nulla che era di "miele" 

[lemonsong]

Il problema è (anche) che non parliamo la stessa lingua, pure letteralmente.

Intanto che cerchi l'errore, QUI c'è un accrocchio fatto in fretta e furia per l'altro tipo di accordion.
Nel sorgente trovi tutto. Più tardi se ho tempo, lo testo meglio e magari posto il codice.

Incavolato? Non mi hai ancora letto incavolato 


 

[Kris]

Io ho inserito tutto è qui, eppure non si apre come nel tuo ultimo , boh.
davvero non parliamo stessa lingua  non so piu cosa fare dai un occhiata al mio codice magari sbaglio ancora , boh . non so davvero.
grazie

[lemonsong]

Intanto posto il codice dell'ultimo esempio; è migliorabile etc...

<!-- Proprietà pagina - Esperto - Prima della chiusura del tag BODY -->
<script>
var links = $('#imTextObject_3_12 a'); //id oggetto con links con ancora accordion

links.each(function() {
  var ancora = $(this).attr('href').split('#msacc');
  $(this).click(function() {
    var titolo = $('#msacc' + ancora[1]).siblings('div[id^="imCellStyleTitle_"]');
    if (titolo.next().is(":hidden")) {
      setTimeout(function() {
        titolo.trigger('click');
        setTimeout(function() {
          location.hash = "msacc" + ancora[1];
        }, 500); //tempo in millisecondi per ritardare l'apertura dell'oggetto
      }, 100); //tempo in millisecondi per ritardare correzione
    }
  });
});
</script>

Io ho inserito tutto è qui, eppure non si apre come nel tuo ultimo , boh.

Il tuo oggetto coi links è nel footer, quindi l'id oggetto con links con ancora accordion è imFooter_imTextObject_01

Non mi pare ci siano altri errori.

Testalo, se non dà problemi bene, altrimenti puoi regolare i tempi in millisecondi.

[Kris]

Ciao Lemon,

Non mi sembra che vadano male i tempi. Se vuoi dai un occhiata. Magari tu vedi meglio, mi sembra tutto a posto.
Finalmente, era questo che volevo. Adesso è perfetto! 
Alla fin fine ci siamo capiti  Sei stato gentile ad aiutarmi. Grazie mille!Buona giornata!
P.S alla prox se avrò bisogno, chiederò 

[Kris]

Ciao Lemon di nuovo,

Scusa stavo dimenticando a chiederti, se volessi che la prima riga su accordion test rimanesse sempre aperto ( senza collagre ad un link? ) solo come accordion test normale,  con la prima voce sempre aperta? Quale sarebbe l'ulteriore codice da inserire per questo? A me piace cosi come , ma visto che siamo nell'argomento accord.test,  preferivo domandarti ora.
Cosi lo salverei anche quella variazione di codice, per eventualitá future. Grazie!

[lemonsong]

Questa risposta che già ti avevo dato non è quello che vuoi?

Per quanto riguarda la seconda domanda (sempre se ho capito): all'oggetto in questione non assegni l'ancora (o non usi il prefisso msacc)... non ti va bene?  La formattazione degli stili etc... la fai da programma.

Se non riscontri problemi coi tempi, lasciali pure così.