un popup informatif à l'ouverture de la page


En plaçant ce code dans la page concernée, vous pouvez faire apparaître des popup informatifs à certains endroits de la page lors de son chargement.
Il est possible de modifier le contenu de
createNoty('Hi! This is my message', 'info');
en par exemple
createNoty('""je suis passé en mode wiki avec du coup [[DocumentatioN ses fonctionnalités]]""', 'info');


""
<!-- on cree une div qui va contenir les alertes (notifications) -->
<div id="noty-holder"></div>
<script>
// fonction pour creer les notifs
function createNoty(message, type) {
    var html = '<div class="alert alert-' + type + ' alert-dismissable page-alert">';
    html += '<button type="button" class="close"><span aria-hidden="true">É</span><span class="sr-only">Close</span></button>';
    html += message;
    html += '</div>';
    $(html).hide().prependTo('#noty-holder').slideDown();
};

// fonction pour attendre que jquery soit chargé pour lancer les notifs
function jloaded() {
    if (window.jQuery) {
       // c'est ici qu'on indique les message a afficher et le type de notif
       createNoty('Hi! This is my message', 'info');
       createNoty('message success', 'success');
       createNoty('message warning', 'warning');
      createNoty('message danger', 'danger');
      createNoty('message info', 'info');
      // fin creation des notifs

     // animation de la fermeture des notifs
      $('.page-alert .close').click(function(e) {
          e.preventDefault();
          $(this).closest('.page-alert').slideUp();
      });
    } else {
        setTimeout(function() { jloaded() }, 50);
    }
}
jloaded()
</script>

<!-- style css pour positionner les notifs (en haut a droite ici), et limiter la taille (300px ici) -->
<style>
#noty-holder{
    width: 300px;
    top: 10px;
    right: 10px;
    font-weight: bold;
    z-index: 1031; /* Max Z-Index in Fixed Nav Menu is 1030*/
    text-align: center;
    position: fixed;
}
</style>""






meilleures banques en ligne

comparatif banque