Domů › Upozornění a dialog

Upozornění a dialog

Modální upozornění:

  • $("#alert").hover(
  function() {
    alert("Your book is overdue.");
  }
);

Modální upozornění vytvořené pomocí jQuery Dialog:

  • // Inserting modal information message when clicking on the link
  $('#dialog a').click(function(event) {
    var link = $(this).attr('href');
    // create message
    $(this).append('<div id="message" title="AKCE">Výprodej!</div>');
    // show message as dialog
    $(function() {
      $("#message").dialog({
        modal: true,
        resizable: false,
        buttons: {
          Ok: function() {
          // close dialog
          $(this).dialog("close");
          // execute a link
          location.href = link;
        }
      }
    });
  });
  // stop link execution
  return false; //event.preventDefault();
});
  • Příklad CSS
  • .ui-dialog .ui-widget-header {
  background: #ffb321;
  color: #7f3300;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.ui-dialog .ui-button {
  background: #d6007f;
  color: #fff;
  box-shadow: none;
}

Další možnosti: