Method Demos

The foobar now supports method calls to perform certain functions after the initial call to the constructor. You can do this by by simply calling the foobar constructor passing in the name of the method to execute.

The below are examples of all the supported methods.


open

Open the foobar, if it is already open nothing happens.

$(".demo-open").click(function(e) {
  e.preventDefault();
  $foobar("open");
});
open

close

Close the foobar, if it is already closed nothing happens.

$(".demo-close").click(function(e) {
  e.preventDefault();
  $foobar("close");
});
close

toggle

Toggle the foobar between open and closed.

$(".demo-toggle").click(function(e) {
  e.preventDefault();
  $foobar("toggle");
});
toggle

prev

Display the previous message, if there is only one message nothing happens.

$(".demo-prev").click(function(e) {
  e.preventDefault();
  $foobar("prev");
});
prev

next

Display the next message, if there is only one message nothing happens.

$(".demo-next").click(function(e) {
  e.preventDefault();
  $foobar("next");
});
next

start

Start the message loop, if it is already running or there is only one message nothing happens.

$(".demo-start").click(function(e) {
  e.preventDefault();
  $foobar("start");
});
start

stop

Stop the message loop, if it is already stopped or there is only one message nothing happens.

$(".demo-stop").click(function(e) {
  e.preventDefault();
  $foobar("stop");
});
stop

destroy

Remove the foobar from the page completely. Once this has been executed you will have to create a new foobar by calling the constructor and supplying it options.

$(".demo-destroy").click(function(e) {
  e.preventDefault();
  $foobar("destroy");
});
destroy reset

option

The option method has multiple uses. You can use it to retrieve the value of a single option, set the value of a single option or set the values of multiple options at once.


This first example shows how to retrieve a single options current value and alert it.

$(".demo-get-single").click(function(e) {
  e.preventDefault();
  var barPosition = $foobar("option", "position.bar");
  alert(barPosition);
});
get option

This second example shows how to set a single options value. The below shows how to change the bar's position from top to bottom.

$(".demo-set-single").click(function(e) {
  e.preventDefault();
  $foobar("option", "position.bar", "bottom");
});
set option reset

This last example shows how to set multiple option values at once by supplying an options object. The below switches the bar's position from top to bottom and also changes the color.

$(".demo-set-multiple").click(function(e) {
  e.preventDefault();
  $foobar("option", {
    "position": {
      "bar": "bottom"
    },
    "display": {
      "backgroundColor": "IndianRed"
    }
  });
});
set options reset