BSConfirmation – Simple Popover con jQuery y Bootstrap


BSConfirmation – Simple Popover con jQuery y Bootstrap, este pop-over es una simple demostración de una ventana pequeña aplicable a cualquier proyecto web, sin duda este pequeño plugin nos ayuda a manipular de forma estratégica la información presentada al usuario, lo interesante que tiene este plugin es que esta realizado para ser usado con bootstrap y la forma de implementar es la siguiente.
Ejemplo:http://oscaruhp.github.io/BSCONFIRM/

1.- Primero tienes que incluir las referencias de jQuery, bootstrap y del plugin:

[html]

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" ></script>
<script src="confirmation.js"></script>
[/html]

2.- El elemento que queremos monitorear

[html]

<div class="container" style="margin:350px auto;">
<button href="http://develoteca.com" target="_blank" class="btn btn-lg btn-danger" id="test">Click to toggle popover</button>
</div>

[/html]

3.- A continuación se agrega el script propio del plugin para crear una ventana sencilla y efectiva con bootstrap que puedes utilizar para mostrar cierta información.

[javascript]

<script type="text/javascript">
var first = $(‘#test’).confirmation({
onShow: function() {
console.log(‘Start show event’);
},

onShown: function() {
console.log(‘Show event has been completed’);
},

onHide: function() {
console.log(‘Start hide event’);
},

onHidden: function() {
console.log(‘Hide event has been completed’);
},

onInserted: function() {
console.log(‘Template has been added to the DOM’);
},

onCancel: function() {
console.log(‘canceled’);
},

onConfirm: function() {
console.log(‘confirmed’);
}
});
</script>
[/javascript]

Puedes descargar el plugin y comentarnos donde lo implementaste.

[adjuntos descripcion=”BSConfirmation” link=”github.com/oscaruhp/BSCONFIRM/archive/gh-pages.zip”]