WebSite X5Help Center

 
Giuseppe Guida
Giuseppe Guida
User

Àncore nella pagina: dubbi e domande  it

Auteur : Giuseppe Guida
Visité 1510, Followers 5, Partagé 0  

Ciao, è tutto spiegato nel video. La soluzione per far funzionare correttamente le ancore c'è, come si evince dal video, ma non deve essere una forzatura, le ancore dovrebbero funzionare a prescindere da tutto il resto, grazie.

LINK del VIDEO: https://youtu.be/KAMDRsvRwW0

Posté le
24 RéPONSES - 2 UTILE
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... mi pare strano; ... forse  queste Ancore hanno preso un qualche valore non richiesto...
... vedi se riesci a produrre il LINK una semplice prova online con tali caratteristiche...
... intanto per un test locale rapido di confronto puoi provare ad usare per l'Ancoraggio l'ID di una tabella invece del punto di Ancoraggio...

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Stiac Engineering
Stiac Engineering
User

Comportamento curioso, e grazie per la segnalazione. Eventualmente hai provato a inserire con del CSS l'altezza minima?

Lire plus
Posté le de Stiac Engineering
Claudio D.
Claudio D.
Moderator
Meilleur utilisateur du mois IT

il "problema" è generato dall'oggetto accordion che ha due dimensioni in altezza, una da chiuso e uno da aperto... nel momento in cui clicchi lui si chiude , ma il posizionamento viene fatto come se lui fosse ancora aperto, perchè così era quando hai cliccato sul link...

mettendogli di fianco un'oggetto della dimensione dell'accordion da aperto/sviluppato , viene calcolato giusto il posizionamento perchè è come se l'accordion rimanesse aperto...

Lire plus
Posté le de Claudio D.
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ciao Claudio... tutto molto chiaro e credo proprio che tu abbia centrato il problema.

Attendo risposta ufficiale dallo staff per capire se ci sono speranze di veder funzionare il tutto in modo regolare.

Grazie

Lire plus
Posté le de Giuseppe Guida
Incomedia
Stefano G.
Incomedia

Buongiorno Giuseppe

Confermo ciò che ha indicato Claudio che è assolutamente sensato

Purtroppo in questi casi, non c'è davvero molto che si può fare. Le ancora sono un sistema completamente integrato nei browser che le gestiscono in autonomia. Se un sito sfrutta sistemi che ne possono variare l'altezza, purtroppo questa è una cosa che può capire

Attualmente, temo di non poter dare alcuna indicazione utile per migliorare la questione se non di evitare ancore in quella pagina

Resto a disposizione

Stefano

Lire plus
Posté le de Stefano G.
Francesco Tedeschi
Francesco Tedeschi
User

Ciao Giuseppe, in alternativa per non lasciare uno spazio vuoto accanto all'oggetto accordition text e faq, l'ancora invece di "ancorarla" sull'oggetto immagine (della regione), puoi aggiungere un oggetto simple separator (con 10 / 20px di spazio) sopra ad ogni oggetto immagine, inserire sul simple separator l'ancora di ogni singola regione.

Lire plus
Posté le de Francesco Tedeschi
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ciao. Ok Stefano, immaginavo. Grazie

Francesco, metto una mappa dell'Italia a destra, mi invento qualcosa. Bisogna peró capire cosa succede poi alle soluzioni responsive quando i contenuti si verticalizzano e la mappa (o oggetto in generale) che da desktop è sulla destra finisce sotto all'accordion. Funzionerà da responsive? Boh? Poi provo anche come hai detto tu. Grazie 

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... per chi leggesse qui, e se ne fosse interessato, e se ancora non lo sapesse, ...ci sono anche mie vecchie/note, semplici e valide soluzioni, generalizzate, alla portata di tutti ed usate da molti:
https://helpcenter.websitex5.com/fr/post/161231#comment4 (Mt:7.6)
... non ho visto esempi, ...ma, ...a secondo dei casi, come ho più volte esposto, forse si potrebbe anche andare oltre...
... ovviamente, come ho detto altre volte e ricordato anche da Stefano, usando gli Ancoraggi storici non ci sarebbero problemi...

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ciao Kol, grazie per le dritte... Purtroppo non è un sito mio che gestisco io e che posso "infarcire" con molto  codice extra, il titolare del sito preferisce a quel punto eliminare le ancore e sistemare la cosa diversamente. Se il sito fosse il mio, con quel po' di conoscenze di HTML e CSS, riuscirei a gestire il codice extra senza problemi, come faccio per altri siti miei personali ma non è questo il caso.

P.S. non so cosa intendi per "... usando gli Ancoraggi storici non ci sarebbero problemi...". 

Questi sono i due esempi:

1) Pagina senza oggetto accanto all'Accordion Text/FAQ (Elenco regioni): https://www.test70.altervista.org/ancore/operatori.html (le ancore non funzionano nè da DESKTOP nè da MOBILE)

2) Pagina con Oggetto di circa 500 px (Mappa Italia) accanto all'Accordion Text/FAQ (Elenco regioni): http://www.test70.altervista.org/ancore/operatori2.html (in questo caso da DESKTOP, solo da DESKTOP, le ancora funzionano a dovere, alle altre risoluzioni al di sotto dei 1150 px non funzionano più)

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

...ciao, ... gli Ancoraggi storici sono appunto quelli HTML di oltre 40 anni fa, cioè i Segnalibri degli Ipertesti che rispettano il formato cartaceo, replicabile in stampa e PDF, né più e né meno; ...con questa formattazione non esistono problemi...

... poi, per il tuo cliente non sarà un problema, in quanto non deve gestire nessun codice, e poi vedo che fa già uso di alcuni miei codici EXTRA per il controllo delle tabelle, pertanto codice in più o meno non farebbe differenza e non se ne accorgerebbe...

...

... vado a vedere meglio la struttura e funzionamento del tuo  esempio, e poi ti faccio sapere su quel che si può fare, ma a prima vista ricordo che avevo già trattato con mio codice esclusivo casi simili per le tab/schede da cui poter prendere spunto: https://helpcenter.websitex5.com/fr/post/243645

.

... a dopo...

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Giuseppe Guida
Giuseppe Guida
User
Auteur

Sì Kol, per le tabelle ho usato la tua stringa per renderle elastiche + altri accorgimenti integrati da me ed in effetti funzionano senza problemi.

Lire plus
Posté le de Giuseppe Guida
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ok Kol, provo poi ad integrare lo script che hai consigliato nel Topic spagnolo, grazie

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... OK, ... il mio codice di BASE per il tuo esempio:

<script>
$("document").ready(function() { //K>
ritardoK= 4; // = secondi di ritardo da valutare;
setTimeout(function() { //K1>
$(".accordion_text a").click(function() { //K2>
k= $(this).attr("href");
setTimeout(function() { //K3>
x5engine.utils.location(k, null, false);
},1500);//K3<<
})//K2<<
},ritardoK*1000);//K1<<
});//K>>
</script>

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... OK (2), ... il mio codice con PRELOAD per il tuo esempio; ...il preload (meglio scaricarlo) serve per valutare i secondi di ritardo, e deve spegnersi dopo l'apparizione dell'Accordion:

<script>
$("document").ready(function() { //K>
ritardoK= 4; // = secondi di ritardo da valutare; Ancoraggio ritardato by KolAsim
//---preloderK-----
preK='<div id="loaderK" style="position:fixed;top:0px;left:0px;width:100%;height:100%;z-index:1000000; background-color:rgba(0,0,0,0.5);background-image: url(\'https://hello-site.ru/main/images/preloads/tail-spin.svg\');background-repeat: no-repeat; background-attachment: fixed; background-position: center center;background-size:20%"> </div>';
$("body").append(preK);
//--- fine preloderK...
setTimeout(function() { //K1>
$(".accordion_text a").click(function() { //K2>
k= $(this).attr("href");
setTimeout(function() { //K3>
x5engine.utils.location(k, null, false);
},1500);//K3<<
})//K2<<
$("#loaderK").hide();
},ritardoK*1000);//K1<<
});//K>>
</script>

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... ti stupirà ... wink...

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ok Kol, ti aggiorno appena inserisco il codice nel mio esempio online :-) Grazie

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... ho visto, ... funziona molto bene sul mio smartphone, secondo le aspetttive, .. ma non sul mio vecchio(!) PC per ritardo troppo basso...
.. comunque, escluso il mio PC, ...è OK... ... e grazie per il test...
... ah! ...meglio non alterare la funzione del ritardo, bensì srebbe meglio agire solo sulla variabile...
... per esempio: > ritardoK = 0.5; (per mezzo secondo); > ritardoK = 1.5; (per un secondo e mezzo); eccetera...
... secondo me, visto che l'Ancora non può essere subito azionata, forse un ritardo di 2-3 secondi interi potrebbe essere equo, e volendo, si potrebbe fare a meno del preload...

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... intanto che osservavo il funzionamento della tu pagina, mi è venuta in mente un'altra mia invenzione, quella del div-sino...

... si accorcerebbe lo sviluppo verticale sei contenuti per una consultazione più facilitata e forse meno macchinosa...

... visto che sei in fase di sviluppo, se ti interessa potresti provarci per valutare, con impegno né più né meno di quello che hai appena provato prima...

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ciao Kol, in effetti ho variato i valori perchè stavo facendo alcune prove, poi non ho più rimesso quelli consigliati da te sulla prova online.

Sì, sarei interessato all'altra tua invenzione, quella del div-sino. Grazie

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

... OK ... ... ho cercato di evitare le funzioni individuali del precedente codice, anche se in teoria forse sono più semplici...
... comunque puoi provarlo su questa tua pagina:
https://www.test70.altervista.org/ancore/operatori.html#imCell_182
........................................................

<style>
/** -- x div_sino by KolAsim -- **/
div[id^='imCellStyleTitle_']:hover {cursor:pointer;color:white !important;}
.chiudeK:hover {cursor:pointer;background:red !important}
.apreK:hover {cursor:pointer;background:yellow !important}
div[id^='imTableObject_230_'] {overflow-x:hidden !important}
</style>
<script>
/** -- div_sino by KolAsim -- **/
$( document ).ready(function() {//K
ritardo_K=3;
setTimeout(function(){//K0>
chiudeK='<div class="chiudeK" style ="position:absolute;top:-20px;right:10px;width:30px;height:30px;background:black;z-index:10;border-radius:42.3px;border: solid 2px; border-color: silver;cursor:pointer" alt="chiude" title="chiude"></div>';
apreK='<div class="apreK" style ="position:absolute;top:-20px;right:10px;width:25px;height:25px;background:white;z-index:11;border-radius:35.25px;border: solid 2px; border-color: silver;cursor:pointer" alt="apre" title="apre"></div>';
$("div[id^='imCellStyleTitle_']").append(apreK);
nK=0;
$("div[id^='imTableObject_230_'] table").hide();
$("div[id^='imCellStyleTitle_']").click(function() {//K1
if (nK == 1) {//K2
$("div[id^='imTableObject_230_'] table").hide();
nK=0;
} //K2<<
else {//K3
idk=$(this).attr("id");
idk= Number(idk.match(/\d+/) );
idkk="#imTableObject_230_"+idk;
cellK="#imCell_"+idk;
$(".chiudeK").hide();
$(cellK).append(chiudeK);
$(".chiudeK").click(function() {//K4>
$("div[id^='imTableObject_230_'] table").hide();
$(this).hide();
});//K4<<
$(idkk+" table").show();
$("div[id^='imTableObject_230_'] table").hide();
$(idkk+" table").show();
location.href = "#imCell_" + idk;
setTimeout(function(){//K5>
topk=$(window).scrollTop();$(window).scrollTop(topk-80);
}, 1000) ;//K5<<
}//K3<<
})//K1<<
}, ritardo_K * 1000) ;//K0<<
});//K<<
</script>

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Giuseppe Guida
Giuseppe Guida
User
Auteur

Ciao Kol. ho provato al volo in locale su Website X5: funziona benissimo! Complimenti.

Poi pubblico anche l'esempio online, ora sto scappando. Ciao

Lire plus
Posté le de Giuseppe Guida
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

...buon notizia, .. grazie per il test... ... ciao...

Lire plus
Posté le de  ‪ KolAsim ‪ ‪