O'Reilly logo

Mastering Bootstrap 4 - Second Edition by Jason Marah, Benjamin Jakobus

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Extending alert's functionality with JavaScript

As with extending the styles, to extend the JavaScript, we can modify Bootstrap's alert.js directly, but again, that is a bad idea in terms of maintainability. Instead, we will create a js directory in our project, and a file called alert.js. Include this file in your HTML, after bootstrap.min.js:

    <script 
    src="node_modules/bootstrap/dist/js/bootstrap.min.js">              </script>
    <script src="js/alert.js"></script>

The first thing we will do is to create an immediately invoked function and add the function to the jQuery object:

    +function ($) {
        'use strict';
        var Alert = $.fn.alert.Constructor;
    }(jQuery);

The function assigns an Alert variable to the alert plugins prototype—which as we saw earlier, is ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required