Archive for the jQuery Category
css3buttons
0
jQuery Plug-In: Botones CSS3 (CSS3 Buttons)

Plug-In para jQuery que permite crear botones CSS3 a partir de un anchor, no hoja de estilos (CSS) necesaria.

HTML

<a href="javascript:;" class="boton">Boton</a>

jQuery

$('.boton').css3button();

Métodos

<!-- Cambiar color del boton
Los colores pueden ser:
orange
red
blue
green
default: gray
-->
$('.boton').css3button({color : 'red'});

<!-- Desactivar boton (state disabled) -->

$('.boton').css3button("disabled");

<!-- Activar boton (state enabled) -->

$('.boton').css3button("enabled");

<!-- Método Destroy -->

$('.boton').css3button("destroy");

Ejemplo

<!-- JavaScript --->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="jquery.css3-buttons.js" type="text/javascript"> </script>

<!-- HTML -->
<a class="boton" href="#" rel="orange">Abrir 0</a>
<a class="boton" href="#" rel="red">Abrir 1</a>
<a class="boton" href="#" rel="blue">Abrir 2</a>
<a class="boton" href="#" rel="green">Abrir 3</a>
<a class="boton" href="#" rel="gray">Abrir 3</a>

<!-- jQuery -->
<script type="text/javascript">
$(document).ready(function(){

	$.each($('a.boton'), function() {
		color = $(this).attr('rel');
		$(this).css3button({color : color});

	});
	$('.boton').click(function( ) {
		$(this).css3button("disabled");
	});

});
</script>

Demo

Demo jQuery Plugin CSS3 Buttons

Download

1