MF Float Away Message class

This is a very basic js function and css to provide a simple floating message that disappears after a given time.

The class is really just a function working with a css that you can use or just implement your own version.

To adjust the position of the messages, you can change right in the .floatingMessageContainer class.

css

.floatingMessageContainer {
    right:120px!important;
}

To make messages come in from the top, use addFloatawayMsg('msg', 'T') Test

To make messages come in from the bottom, use addFloatawayMsg('msg', 'B')Test

html  ::  Simple usage

<link rel='stylesheet preload prefetch' as='style' href='https://methodfish.com/Download/MFFloatawayMsg/files/latest/css/mf-floataway-msg.css'>
<script src='https://methodfish.com/Download/MFFloatawayMsg/files/latest/js/mf-floataway-msg.js'></script>

<script>
addFloatawayMsg("test","T"); // messages at the top of the page
addFloatawayMsg("test","B"); // messages at the bottom of the page
</script>

To adjust the timing of the fade away, there is a third argument for duration (defaulting to 3000ms).

To adjust the console logging from .log to .error you can use the fourth argument isError (defaulting to false).

To adjust the styling of the message, you can include a fifth argument addClassNm to include an additional class name to the message div.

js

addFloatawayMsg(message, positionCd, duration = 3000, isError=false, addClassNm = '')