alert() function is disgusting on website that’s rich with design. A simple
alert() function looks like this on a browser,
alert() function is of three types,
alert() function. My plug-in is not a replacement for the
alert() function, but it could do what the
alert() function does and more over the popup design could be changed by CSS. Simple!
I named my plug-in jPopOut, take a look at the demo here.
- jQuery: Of course, that’s the soul of the plug-in.
- FontAwesome: Font Awesome gives you scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS. Have the full details on Font Awesome here.
I have added a repository for jPopOut in Github, you are invited to connect and work together with me to improve the plug-in even better. You are also free to download the source code, edit it and free to use it in any of your projects.
alert() function and more features are yet to come.
jPopOut: Methods and Callbacks
title: The title to be displayed on the alert header, if no title specified or if its empty, then the default text will be set as “your_window_location_hostname says:” (e.g. localhost:8080 says:)
messageType: What type of message are you displaying in the alert box, depending on this corresponding icons will be set on the alert header and body. Following are the message types available now, error, warning, success and prompt.
message: The message that need to be displayed on the alert box. Expects to be type of string.
okBtnText: You have the option to specify you custom name on the ‘OK’ button, by default the button name would be OK, but you could set is as per your requirements like ‘Yes’, Done, Confirm etc.
btnOkClick: You could specify your custom function, to be executed when the OK button is being clicked.
cancelBtnText: The text that you need to specify on the Cancel button as per your requirement.
btnCancelClick: Function to be executed when the user clicks on the cancel button.
I would appreciate your feedback and suggestions or even report bugs if found on this plugin because this is my first plug-in out for UX developers like you. Hope you would use this in your projects. Happy coding! 🙂