Con JQuery Cookies: UI suggerimenti / note - nascondili dopo aver continuato l'utente
-
21-12-2019 - |
Domanda
Il punto di partenza :
Ho un'interfaccia di app Tricky Web (non dovrebbe essere così, ma questo è un altro argomento). Da capire dall'utente, ho costruito su suggerimenti. Ad esempio: una freccia mostra la direzione per scorrere lo schermo per mostrare il menu.
Il problema :
Ogni volta che un utente ricarica la pagina o vai su un'altra pagina (sub-), i suggerimenti appaiono di nuovo. Senza senso - e fastidioso per l'utente.
La soluzione :
Mostra i suggerimenti solo quando necessario. Quando l'utente attiva un evento, il suggerimento per questo evento scompare. Se l'utente ricarica o visita la pagina alcuni giorni dopo capisce già come funziona e non ha bisogno di vedere i suggerimenti.
L'implementazione :
Biscotti jQuery. Qualcosa come:
Se l'evento è attivato -> set cookie. Cookie dice -> Non mostrare suggerimenti (ad esempio con .css ("Display", "None") sarebbe sufficiente)
dove ho bisogno del tuo aiuto :
Non trovo un buon tutorial o documentazione per i cookie jQuery. Sono un principiante jquery. Le funzioni facili non sono problemi. Ma questo è un po 'troppo grande.
Grazie per qualsiasi aiuto o link utili!
Soluzione
jsfiddle: http://jsfiddle.net/wrxsti85/9nubf/
Questa è una vecchia configurazione di biscotti di base che usavo.Non richiede altre librerie così i suoi piccoli e leggeri.
La prima volta che carichi il violino che vedrai il tooltip.Fai clic su Esegui di nuovo, e non sarà lì.
function getCookie(c_name) {
var i, x, y, ARRcookies = document.cookie.split(";");
for (i = 0; i < ARRcookies.length; i++) {
x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
x = x.replace(/^\s+|\s+$/g, "");
if (x == c_name) {
return unescape(y);
}
}
}
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function checkCookie() {
var status = getCookie("showToolTip");
if (status != null && status == 1) {
$('.TT').hide();
} else {
setCookie("showToolTip", "1", 365);
}
}
$(function() {
checkCookie();
});
.
Spero che questo aiuti!Fammi sapere se hai domande.