Voici un script permettant d’ouvrir une popup à l’ouverture d’une page html, de paramétrer la fermeture automatique, créer un cookie et ainsi pouvoir spécifier que cette popup s’ouvrira qu’une fois toutes les 24heures par exemple.
voir l’exemple sourceVoir les commentaires dans le script :
<!-- chargement de jQuery library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <!-- chargement du petit script de cookies, plus de détails à https://github.com/carhartl/jquery-cookie --> <script type="text/javascript" src="jquery.cookie.js"></script> <!-- chargement de fancybox --> <script type="text/javascript" src="js/fancybox/jquery.fancybox.js"></script> <link rel="stylesheet" type="text/css" href="js/fancybox/jquery.fancybox.css" media="screen" /> <!-- appel de la fancybox --> <script type="text/javascript"> $(document).ready(function() { if($.cookie('the_cookie') != 1) { // Si the_cookie n'a pas pour valeur 1 alors on l'initialise et on joue l'appel de la popup $.cookie('the_cookie', '1', { expires: 1 }); // valeur en jour(s) avant expiration du cookie $.fancybox( $("#popup").html(), { type : 'iframe', href : 'mapage.html', // url vers notre page html qui sera chargée dans la popup en mode iframe maxWidth : 800, maxHeight : 600, fitToView : false, width : '70%', height : '70%', autoSize : false } );setTimeout("parent.$.fancybox.close()", 5000); // temps en milliseconde avant fermeture de la popup } }); </script>
Dans le body :
<a id="popup" style="display:none;"></a>
Click to rate this post!
[Total: 13 Average: 4.7]
Bonjour,
j’ai bien lu votre article Jquery Fancybox Onload + Delay Avant Fermeture + Cookie cependant je n’arrive pas à le faire fonctionner.
Serait-il possible de mettre un lien pour télécharger l’exemple que vous avez fait.
Cordialement
Les fichiers sources sont ajoutés.
Bonjour,
Super sa fonctionne correctement, merci pour le partage.
Est-il possible d’ajouter un delay d’ouverture en plus du delay de fermeture , genre 2 ou 3 secondes apres le chargement de la page.
Cdt
Merci beaucoup pour tes scripts, très utile et très clair, je garde ton site en favoris précieusement !
Parfait ! Merci 🙂
Super résultat, merci beaucoup pour ce partage.
Bonjour,
encore merci pour ce script !
Est il possible d’y ajouter 2 boutons en bas, comme pour valider un accès, un bouton « accéder » vers une url et un autre « annuler » vers une autre url ?
Identique aux accès genre de plus de 18 ans, « vous avez plus de 18 ans, cliquez ici ».
Merci.
Merci beaucoup pour votre aide et votre réactivité.
Tout fonctionne parfaitement !
Arnaud
works perfectly, thank you, but I would have the opportunity to make a refresch of the page when the fancybox closes; do you think is it possible?
I think it’ s possible
look this jsfiddle.net/EWTxv/
Parfait, merci beaucoup pour ce bout de code !
Je cherche à rajouter au popup un délais avant son ouverture mais je n’y parviens pas 🙁
Bonjour et merci pour ce bon script.
Vous êtes un génie, le code marche sans aucun souci.
Mais comment on doit procéder pour modifier le nombre de jour en 12 heures ?
Merci d’avance pour votre retour.
Cdt,
Mettre :
expires: 0.5 au lien de expires: 1
Bonjour,
Tout d’abord super tuto, j’étais partit dans ce style et ce post m’a grandement aidé.
En revanche le expires: 0.5 ne marche pas pour établir une suppression après des heures et non des jours.
Sure que les valeurs décimales sont prises en compte ?
Merci, Quelle version d’IE ?
Bonjour, et merci pour le partage sympa.
Une question : comment faire disparaitre les barres de scrolling (qui restent même avec scrolling:no).
Merci 😉
Avez un lien du dit problème
Bonsoir,
Tout d’abord super tuto.
Tout fonctionne parfaitement ! Sauf la delay de fermeture
Erreur dans la console?
Uncaught TypeError: Cannot read property ‘close’ of undefined
jQuery(document).ready(function($) {
if($.cookie(‘the_cookie’) != 1) { // Si the_cookie n’a pas pour valeur 1 alors on l’initialise et on joue l’appel de la popup
$.cookie(‘the_cookie’, ‘1’, { expires: 1 }); // valeur en jour(s) avant expiration du cookie
$.fancybox(
$(« #popup »).html(),
{
type : ‘iframe’,
href : ‘/Major.jpg’, // url vers notre page html qui sera chargée dans la popup en mode iframe
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : ‘70%’,
height : ‘70%’,
autoSize : false
}
);setTimeout(« parent.$.fancybox.close() », 5000); // 5000 milliseconds = 5 seconds
}
});
Merci
personne?
merci
salut,
si je supprimer la ligne setTimeout(« parent.$.fancybox.close() », 5000); // 5000 milliseconds = 5 seconds
plus d’erreur dans la console
merci
salut,
j’ai du personnaliser,le code pour l’avoir en responsive
maintenant il fonctionne très bien
plus d’erreur
Merci