Bootstrap feedback slider

Bootstrap feedback slider is one animated UI feedback from that will merge with any design in your site with out taking much space, this is purely based on  Jquery.So we will be using a Jquery plugin called feedback_me.js i have  give the link below for this plugin

Features

1.It post data in Ajax.

2.Bootstrap support.

3.HTML5 support.

4.Easy to customize.

Installation

1.Download  the feedback_me library (Download).

2.Add the Jquery library  below the <head> .

<script style="" src="http://code.jquery.com/jquery-1.9.1.js"></script>

3.Now include the jquery.feedback_me.js plugin below  the Jquery library  that will found under the js folder  from the downloaded file.

<script type="text/javascript" src="/feedback_me-master/js/jquery.feedback_me.js"> </script>

4.So all  the necessary JS libray are include.oh wait ! one more thing  we need some design for the form obviously,no need to make your the downloaded file comes with a CSS file for that it will under Css/jquery.feedback_me.css include the css.

<link rel="stylesheet" type="text/css" href="/css/jquery.feedback_me.css">

<script style="" src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script type="text/javascript" src="/feedback_me-master/js/jquery.feedback_me.js"> </script>

<link rel="stylesheet" type="text/css" href="/css/jquery.feedback_me.css">

 

Calling the Plugin

To call the plugin we need to call this initialize  function  fm.init(fm_options);  during the page load so we use   $(document).ready(function() { }); and add our fm.init(fm_options); inside  $(document).ready(function() { });

$(document).ready(function() {

fm.init(fm_options);

});

 

After  that we need to setup basic stuff like add text box,validation,placeholder

  //set up some basic options for the feedback_me plugin
    fm_options = {
        position: "right-top",

     name_required: true,
     message_placeholder: "Go ahead, type your feedback here...",
     show_email: true,
     email_required:true,
     message_required: true,
     show_asterisk_for_required: true,
     feedback_url: "submit_feedback.php",
       custom_params: {
         custom_name: custom
        }
    };
    //init feedback_me plugin
    fm.init(fm_options);

 

 

Leave a Reply