javascript - Notify JS not working - Stack Overflow

admin管理员组

文章数量:1401964

I am working on a Notify JS Notification option. I have tried but its not working. If I remove Style and class name its working fine.

   <style>

    .notifyjs-happyblue-base {
      white-space: nowrap;
      background-color: lightblue;
      padding: 5px;
    }
    .notifyjs-happyblue-superblue {
      color: white;
      background-color: blue;
    }
    </style>
<script src=".0.0.min.js"></script>
<script src="notify.js"></script>
<script src="notify.min.js"></script>  

<script>

        $(function(){
          $.notify("Your Break is Approved", {
            style: 'happyblue',
            className: 'superblue'
            title: "E-Contact Application"
          });
     });
</script>

I am working on a Notify JS Notification option. I have tried but its not working. If I remove Style and class name its working fine.

   <style>

    .notifyjs-happyblue-base {
      white-space: nowrap;
      background-color: lightblue;
      padding: 5px;
    }
    .notifyjs-happyblue-superblue {
      color: white;
      background-color: blue;
    }
    </style>
<script src="http://code.jquery./jquery-3.0.0.min.js"></script>
<script src="notify.js"></script>
<script src="notify.min.js"></script>  

<script>

        $(function(){
          $.notify("Your Break is Approved", {
            style: 'happyblue',
            className: 'superblue'
            title: "E-Contact Application"
          });
     });
</script>

• javascript
• jquery
• notifyjs

Share Improve this question Follow edited Oct 17, 2017 at 20:20 halfer 20.4k1919 gold badges109109 silver badges202202 bronze badges asked Oct 17, 2017 at 18:43 MahaMaha 2522 silver badges66 bronze badges 4

• 3 You need a ma after the class name. i.e. className: 'superblue', – p.s.w.g Commented Oct 17, 2017 at 18:47
• @p.s.w.g I have included ma its not working – Maha Commented Oct 17, 2017 at 18:50
• 2 It's not working isn't very descriptive. Are you seeing an error or unexpected results? Other than the typo, the only possible issue I can see is that you're importing notify.js and notify.min.js -- typically x.min.js is just a minified version of x.js so there's no need to include both. I remend putting a snippet or fiddle together to demonstrate the issue you're seeing. – p.s.w.g Commented Oct 17, 2017 at 18:54
• From the official close reasons: Questions seeking debugging help ("why isn't this code working?") must include ... a specific problem or error. – halfer Commented Oct 17, 2017 at 20:21

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

Step one, just include the script once... you are including the unprssed version, and the minified version...

<script src="http://code.jquery./jquery-3.0.0.min.js"></script>
<!--<script src="notify.js"></script> DITCH THIS LINE -->
<script src="notify.min.js"></script>

Step two, make sure your syntax is correct...

$(function(){
    $.notify("Your Break is Approved", {
        style: 'happyblue',
        className: 'superblue', // <-- just a ma, but really important
        title: "E-Contact Application"
    });
});

Putting it all together...

<script src="https://code.jquery./jquery-3.0.0.min.js"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/notify/0.4.2/notify.min.js"></script>
<script>
    $.notify.addStyle('happyblue', {
     html: "<div>☺<span data-notify-text/>☺</div>",
     classes: {
        base: {
          "white-space": "nowrap",
          "background-color": "lightblue",
          "padding": "5px"
        },
        superblue: {
          "color": "white",
          "background-color": "blue"
        }
      }
    });


    $.notify("Your Break is Approved", {
        style: 'happyblue',
        className: 'superblue', // <-- just a ma, but really important
        title: "E-Contact Application"
    });
</script>

use $.notify.addStyle(... befor $.notify("Message",...

$.notify.addStyle('happyblue', {
  html: "<span><span data-notify-text/></span>",
     classes: {
        base: {
          "white-space": "nowrap",
          "background-color": "lightblue",
          "padding": "5px"
        },
        superblue: {
          "color": "white",
          "background-color": "blue"
        }
      }
});

$.notify("Message", {
  style: 'happyblue',
  className: 'superblue'
});

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit./notifyjs/notifyjs/master/dist/notify.js"></script>

本文标签： javascriptNotify JS not workingStack Overflow