WebSite X5Help Center

 
Stefano L.
Stefano L.
User

Ancore e sticky bar... per kolasim  it

Autor: Stefano L.
Visited 215, Followers 2, Udostępniony 0  

Buongiorno KolAsim, rinnovo un anomalia che ho rinvenuto ora per uno script che risolveva la sovrapposizione della Sticky bar alle ancore, esempio qui:

1. apri questo link

2. clicca su una voce qualsiasi del sommario

3. noterai che le ancore non funzionano

4. ora clicca su una pagina qualunque del menù (es. Manuali)

5. vai nel Footer e clicca il link Spedizioni (che punta alla voce 10 del sommario nella pagina del punto 1 con /... #Art_10)

6. L'ancora funziona

7. se clicchi su qualsiasi voce del sommario l'ancora punta sempre alla voce 10...

comportamento strano....

questo lo script che ho caricato tramite Tag manager:

<script>
$(document).ready(function() {//K>;
/** Ancoraggio dinamico EXTRA con compensazione x terza pagina by KolAsim **/
secondiK = 3; // secondi di ritardo;
setTimeout(function(){ //K1>;
hK=$("#imStickyBar").height();
}, 1000);//K1<<;
//-------------------------------------
setTimeout(function(){ ritardoK(); }, secondiK * 750);//K2> | <<;
});//K<<;
//--------------------KK--------------
$( window ).on( "resize", function() {//KK>;
setTimeout(function(){ //K3>
hK=$("#imStickyBar").height();
}, 1000);//K3<<;
} );//KK<<;
//---------------------f K4-------------
function ritardoK() { //K4>;
rnpK = window.location.href.split('/');
ancoraK = rnpK[rnpK.length - 1];
if(ancoraK.indexOf("#") == - 1){ } //K5> | <<;
else {//K6>;
if(ancoraK.indexOf("#") != -1){//K7>;
location.href = ancoraK;
anchor_K();
}//K7<<;
}//K6<<;
} //K4<<;
//---------------------f K8-------------
function anchor_K() { //K8>
setTimeout(function(){ //K9>
hK=$("#imStickyBar").height();
scrollK=$(window).scrollTop();
scrollK=scrollK-hK;
$('html,body').animate({ //K10>;
scrollTop: scrollK
}, 250);//K10<<;
}, 750);//K9<<;
} //K8<<;
</script>

Posted on the
23 ODPOWIEDZI - 4 USEFUL
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... prova con questa variante x div-#imCell_32:

<script>
$("document").ready(function() { //K>;
/** Ancoraggio dinamico x stessa pagina e da terza pagina by KolAsim **/
secondiK = 3; // secondi di ritardo; // va valutare;
objectK = "#imCell_32"; //selettore contenitore collegamenti alle ancore di pagina;
setTimeout(function() { //K1>;
$(objectK + " .imCssLink").click(function(){//K2>;
linkK = $(this).attr("href");
controlloK();
});//K2<<;
anchorK = window.location.hash;
x5engine.utils.location(anchorK, null, false);
controlloK();
},secondiK*1000);//K1<<;
}); //K<<;
//-------------- f K3 --------------
function controlloK(){//K3>;
hK=$("#imStickyBarContainer").height();
setTimeout(function(){ //K4>
scrollK=$(window).scrollTop();
scrollK=scrollK-hK;
$('html,body').animate({//K5
scrollTop: scrollK
}, 500);//K5<<
}, 500);//K4<<
};//K3<<;
</script>

.

ciao

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

Ciao Kol, in Tag Manager ho disabilitato il vecchio script e caricato il tuo nuovo:

all'interno della pagina condizioni di vendita cliccando le voci del sommario tutto funziona, mentre se clicco il link "Spedizioni" nel footer non funziona...

fa anche una strano comportamento sulle altre ancore all'interno del sito... esempio se clicci il primo bottone "CALCULATOR" (sotto a ROAD) in questa pagina, la pagina scorre tutta in alto ma se poi clicchi nuovamente funziona... la stessa cosa la fa al primo click nella pagina delle condizioni di vendita...

Czytaj więcej
Posted on the from Stefano L.
Stefano L.
Stefano L.
User
Autor

ho dovuto toglierlo perchè appena facevi scroll con mouse la pagina continua a tornare su.....

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... il precedente codice era riferito ad uno specifico selettore evidenziato...

... prova con questa variante che prende in carico tutti i collegamenti della pagina:

<script>
$("document").ready(function() { //K>;
/** Ancoraggio dinamico x stessa pagina e da terza pagina by KolAsim **/
secondiK = 3; // secondi di ritardo; // va valutare;
objectK = "body a";
setTimeout(function() { //K1>;
$(objectK).click(function(){//K2>;
linkK = $(this).attr("href");
controlloK();
});//K2<<;
anchorK = window.location.hash;
x5engine.utils.location(anchorK, null, false);
controlloK();
},secondiK*1000);//K1<<;
}); //K<<;
//-------------- f K3 --------------
function controlloK(){//K3>;
hK=$("#imStickyBarContainer").height();
setTimeout(function(){ //K4>
scrollK=$(window).scrollTop();
scrollK=scrollK-hK;
$('html,body').animate({//K5
scrollTop: scrollK
}, 500);//K5<<
}, 500);//K4<<
};//K3<<;
</script>

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

ok...stai in linea...

Czytaj więcej
Posted on the from Stefano L.
Stefano L.
Stefano L.
User
Autor

sembra che funzioni ma al caricamento di ogni pagina, sembra che al momento che scrolli, riavvolga la pagina all'inizio... prova a vedere se lo riscontri anche tu...

Czytaj więcej
Posted on the from Stefano L.
Stefano L.
Stefano L.
User
Autor

......ora l'ho tolto, confermo che a ogni pagina caricata si riavvolge in alto...

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... non ho potuto valutare, ma penso dipenda dal ritardo del calcolo di 3 secondi sul caricamento/latenza della pagina come indicato:

secondiK = 3; // secondi di ritardo; // va valutare;

... fai le prove impostando oppure 1, per es.:

secondiK = 0;

... altrimenti bisognerebbe inibire lo scroll anticipato con il mio preload come quello che usi in cartsearch...

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

Posso prepararlo e se mi fai un fischio alle 11:45 te lo pubblico online...

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... OK ...  salvo imprevisti penso di esserci ...

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

è online... ho messo 0 ed è migliorato un pochino.. riavvolge sempre comunque ...

Czytaj więcej
Posted on the from Stefano L.
Stefano L.
Stefano L.
User
Autor

uhmmmm... in modalità test di tag manager sembra faccia ancora il difetto.. online sembra che sia a posto... percepito poco...

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... ho controllato, non vedo il codice nel sorgente, ma mi pare OK...

... il riavvolgimento non l'ho notato, ma nel caso potrebbe dipendere dal rilevamento delle ancore...

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

il codice sorgente forse non lo vedi perchè è gestito con google tag manager?

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Stefano L.
il codice sorgente forse non lo vedi perchè è gestito con google tag manager?

... non so cosa sia ... embarassed

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor
 ‪ KolAsim ‪ ‪
Stefano L. il codice sorgente forse non lo vedi perchè è gestito con google tag manager? ... non so cosa sia ...

é un servizio di google che ti permette di gestire tutti gli script del sito dall'esterno e non inserendoli come oggetti nelle pagine di WS5... sembra funzioni... tengo sott'occhio se presenta anomalie..

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... grazie, buono a sapersi ... smile

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... prova; ... con questa piccola modifica in (//K3> | //K3<<) dovrebbe fare lo scroll solo per ancore da terza pagina:

<script>
$("document").ready(function() { //K>;
/** Ancoraggio dinamico x stessa pagina e da terza pagina by KolAsim **/
secondiK = 3; // secondi di ritardo; // va valutare;
objectK = "body a";
setTimeout(function() { //K1>;
$(objectK).click(function(){//K2>;
linkK = $(this).attr("href");
controlloK();
});//K2<<;
anchorK = window.location.hash;
if(anchorK.indexOf("#") != -1){//K3>;
x5engine.utils.location(anchorK, null, false);
controlloK();
}//K3<<;
},secondiK*1000);//K1<<;
}); //K<<;
//-------------- f K4 --------------
function controlloK(){//K4>;
hK=$("#imStickyBarContainer").height();
setTimeout(function(){ //K5>
scrollK=$(window).scrollTop();
scrollK=scrollK-hK;
$('html,body').animate({//K6
scrollTop: scrollK
}, 500);//K6<<
}, 500);//K5<<
};//K4<<;
</script>

...

... altrimenti mantieni il precedente...

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

è online... sembra sia perfetto... ho solo modificato 

secondiK = 0; // secondi di ritardo; // va valutare;

e

}//K3<<;
},secondiK*750);//K1<<;
}); //K<<;

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

secondiK = 0; //

... OK.. va bene, ... ma il controllo successivo (//K1<<;) non andrebbe modificato, anche se sembra ininfluente...

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

riportato a 1000, ma comunque funziona...

Sempre grazie infinite per il tuo supporto!

Czytaj więcej
Posted on the from Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... 0 x 1000 = 0   ...   (non viene rilevato) ...

Stefano L.
... ... ...  se clicci il primo bottone "CALCULATOR" (sotto a ROAD) in questa pagina, la pagina scorre tutta in alto ... ... ... 

... prima non l'avevo visto; ...non si tratta di collegamento normale ma di evento associato ad un pulsante...

... nelle pagine con questo tipo di pulsante  puoi provare con questo mio codice dedicato:

<script>
$("document").ready(function() { //K>;
/* -- offset Ancore da pulsanti by KolAsim --*/
secondiK = 3; // secondi di ritardo; // va valutare;
objectK2 = ".pricing__action";
setTimeout(function() { //K1>;
$(objectK2).click(function(){//K2>;
linkK = $(this).attr("onclick");
if(linkK.indexOf("#") !=-1){//K3>;
k = linkK.split("#").pop();
controlloK();
};//K3<<;
});//K2<<;
},secondiK*1000);//K1<<;
}); //K<<;
function controlloK(){//K4>;
setTimeout(function(){ //K5>
hK=$("#imStickyBarContainer").height();
scrollK=$(window).scrollTop();
scrollK=scrollK-hK;
$('html,body').animate({//K6
scrollTop: scrollK
}, 500);//K6<<
}, 500);//K5<<
};//K4<<;
</script>

.

Czytaj więcej
Posted on the from  ‪ KolAsim ‪ ‪
Stefano L.
Stefano L.
User
Autor

FUNZIONA ALLA PERFEZIONE!

Czytaj więcej
Posted on the from Stefano L.