Toast - iOC

Basic Textual Toast

Show example code

                                
                                    {{ \App\Helper::formatCode('
                                        // Non sticky version
                                        $("#basic-non-sticky-toast").on("click", function() {
                                            Toastify({
                                                text:
                                                "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, consequuntur doloremque eveniet eius eaque dicta repudiandae illo ullam. Minima itaque sint magnam dolorum asperiores repudiandae dignissimos expedita, voluptatum vitae velit.",
                                                duration: 3000,
                                                newWindow: true,
                                                close: true,
                                                gravity: "bottom",
                                                position: "left",
                                                backgroundColor: "#0e2c88",
                                                stopOnFocus: true
                                            }).showToast();
                                        })

                                        // Sticky version
                                        $("#basic-sticky-toast").on("click", function() {
                                            Toastify({
                                                text:
                                                "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, consequuntur doloremque eveniet eius eaque dicta repudiandae illo ullam. Minima itaque sint magnam dolorum asperiores repudiandae dignissimos expedita, voluptatum vitae velit.",
                                                duration: -1,
                                                newWindow: true,
                                                close: true,
                                                gravity: "bottom",
                                                position: "left",
                                                backgroundColor: "#0e2c88",
                                                stopOnFocus: true
                                            }).showToast();
                                        })
                                    ') }}

Toast using HTML as a text

Show example code

                                
                                    {{ \App\Helper::formatCode('
                                        // Non sticky
                                        $("#html-non-sticky-toast").on("click", function() {
                                            Toastify({
                                                node: $(
                                                "Let\'s test some HTML stuff... Github""
                                                )[0],
                                                duration: 3000,
                                                newWindow: true,
                                                close: true,
                                                gravity: "bottom",
                                                position: "left",
                                                backgroundColor: "#0e2c88",
                                                stopOnFocus: true
                                            }).showToast();
                                        })

                                        // sticky
                                        $("#html-sticky-toast").on("click", function() {
                                            Toastify({
                                                node: $(
                                                "Remember! You can always introduce your own × HTML and CSS in the toast."
                                                )[0],
                                                duration: -1,
                                                newWindow: true,
                                                close: true,
                                                gravity: "bottom",
                                                position: "left",
                                                backgroundColor: "#0e2c88",
                                                stopOnFocus: true
                                            }).showToast();
                                        })
                                    ') }}