Entradas con la etiqueta ‘Javascript’
De un tiempo hacia aquí se están popularizando de sobremanera los menús desplegables, pero como en todos los ámbitos del diseño, no todos son igual de bonitos ni quedan igual de bien.
Leer el resto de esta entrada »
Mu Connect es una librería JS que nos facilitará la tarea de conectar con Facebook desde nuestras aplicaciones. Al tratarse de una librería en Javascript nos permite visualizar esta conexión como una capa superior a nuestra aplicación ofreciéndola como un extra más y hacer que nuestra aplicación no dependa de ella.
<div id="fb-root"></div>
<script src="http://mu.daaku.org/m.js"></script>
<script>
// Inicializamos la librería con la API de nuestra Aplicación
FB.init({ apiKey: '48f06bc570aaf9ed454699ec4fe416df' });
// Controlamos el login al acceder
FB.loginStatus(handleSessionResponse);
// Activamos login
$('#login').bind('click', function() {
FB.login(handleSessionResponse);
});
// Activamos logout
$('#logout').bind('click', function() {
FB.logout(handleSessionResponse);
});
// Activamos disconnect
$('#disconnect').bind('click', function() {
FB.api({ method: 'Auth.revokeAuthorization' }, function(response) {
clearDisplay();
});
});
function clearDisplay() {
$('#user-info').hide('fast');
}
// Gestionamos el login
function handleSessionResponse(response) {
if (!response.session) {
clearDisplay();
return;
}
// Preparamos la petición FQL
FB.api(
{
method: 'fql.query',
query: 'SELECT name, pic FROM profile WHERE id=' + FB.getSession().uid
},
function(response) {
var user = response[0];
$('#user-info').html('<img src="' + user.pic + '">' + user.name).show('fast');
}
);
}
</script> Leer el resto de esta entrada »
David Walsh publicó hace unos días una implementación del método con flash para poder interactuar con el portapapeles desde nuestro Javascript
// HTML
<script type="text/javascript" src="ZeroClipboard.js"></script>
<textarea name="box-content" id="box-content" rows="5" cols="70">
The David Walsh Blog is the best blog around! MooTools FTW!
</textarea>
<br /><br />
<p><input type="button" id="copy" name="copy" value="Copy to Clipboard" /></p> Leer el resto de esta entrada »
En OpenJS publican un interesante script para facilitarnos una forma de controlar el teclado desde Javascript. Debido a la facilidad con la que ha sido desarrollado permite realizar combinaciones de teclas de una forma fácil y sobretodo fácil de comprender al mirar el código.
shortcut.add("Ctrl+Shift+X",function() {
alert("Hi there!");
});Instalación
Al igual que cualquier script de Javascript la instalación comienza por la inclusión del fichero JS que contiene la lógica del script.
<script src="shortcut.js" type="text/javascript"></script>Una vez incluido a nuestro proyecto, ya podemos indicar nuestras combinaciones de teclas.
Leer el resto de esta entrada »
Ad Gallery es un plugin jQuery para crear una galería de imágenes / Showcase rápidamente.
El plug-in utiliza listas desordenadas y los convierte ofreciendo gran cantidad de opciones para una mejor personalización.
Leer el resto de esta entrada »
Aquí se mencionará como utilizar la función de animación de jQuery y se demostrará su flexibilidad.
La sintaxis de uso es la siguiente:
$.animate(options, settings, callback);
/* puedes reemplazar setting por duration (in milliseconds) o con palabras: 'slow', 'normal' o 'fast'.
callback es opcional */
A continuación la lista de las animaciones mas populares:
Leer el resto de esta entrada »
Con la aparente decisión de que el nuevo estándar a ser adoptado por la comunidad desarrolladora web será HTML 5, existen ansias de disfrutar luego todas su bondades, aunque siento aún lejano su total uso dado lo lento que suele ser por parte de los usuarios la actualización de sus navegadores a uno más moderno y que soporte estas nuevas especificaciones, que ya han ido apareciendo. Pero eso no quita que desde ya comencemos a jugar un poco con él.
Ya he comentado sobre las características de este nuevo estándar, y en este momento nos concentraremos en una maqueta funcional utilizando las nuevas etiquetas y sus nuevas posibilidades. Es interesante saber que podemos utilizar elementos de HTML 5 en estos momentos aunque la mayoría de los browsers aún no lo soporten; esto se debe a que CSS puede dar estilo a cualquier etiqueta, aunque ésta prácticamente no exista (aún). Por ejemplo, si me da la gana puedo inventar una etiqueta propia y darle estilos:
Leer el resto de esta entrada »
Tutorialzine comparte un buen tutorial con la fuente en la creación de un formulario de contacto de fantasía ajaxed que se construye con jQuery y PHP.
El formulario es no intrusivo y valida del lado del servidor:
Formulario de contacto con JQuery y PHP
Leer el resto de esta entrada »