JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile.structure-1.4.3.min.css">
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/4804759/jsfiddle/%5B2014-07-22%5D%20pnotify-jquerymobile/jquery.mobile.icons.min.css">
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/4804759/jsfiddle/%5B2014-07-22%5D%20pnotify-jquerymobile/pnotify.custom.min.css">
<script src="https://dl.dropboxusercontent.com/u/4804759/jsfiddle/%5B2014-07-22%5D%20pnotify-jquerymobile/pnotify.custom.min.js"></script>
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/4804759/jsfiddle/%5B2014-07-22%5D%20pnotify-jquerymobile/my-custom-theme.css">
<p>a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content a lot of content </p>
CSS
.custom-notif {
background: white;
}
.ui-state-error {
background: red;
text-shadow: none;
}
.ui-state-default {
background: green;
text-shadow: none;
}
.ui-state-highlight {
background: blue;
text-shadow: none;
}
JavaScript
new PNotify({
title: "asdasd",
text: "asdasdsa",
type: "error",
delay: 999999,
styling: 'jqueryui',
addclass: 'custom-notif',
mouse_reset: false,
buttons: {
sticker: false,
closer_hover: false,
}
});
new PNotify({
title: "Success",
text: "I am a success notice",
type: "success",
delay: 999999,
styling: 'jqueryui',
addclass: 'custom-notif',
mouse_reset: false,
buttons: {
sticker: false,
closer_hover: false,
}
});
new PNotify({
title: "Regular",
text: "I am a regular notice",
delay: 999999,
styling: 'jqueryui',
addclass: 'custom-notif',
mouse_reset: false,
buttons: {
sticker: false,
closer_hover: false,
}
});