www.anieto2k.com Open in urlscan Pro
77.87.125.105  Public Scan

Form analysis
1 forms found in the DOM

GET https://www.anieto2k.com/

<form id="search" action="https://www.anieto2k.com/" method="get">
  <p>
    <label for="s" class="hide">Buscar:</label>
    <input class="input" type="text" name="s" value="Buscar" id="s">
    <input class="submit" type="submit" value="Buscar">
  </p>
</form>

Text Content

 * Pasar de los marcadores
 * Pasar del menú
 * Pasar del contenido
 * Pasar de todo

--------------------------------------------------------------------------------


ANIETO2K DESARROLLO WEB, WORDPRESS, Y ALGUNA COSILLA MÁS


Andrés Nieto
Palma de Mallorca, España
Más...

--------------------------------------------------------------------------------


MENÚ

 * Inicio
 * Plugins & Themes
 * Preguntas
 * Contacto
 * RSS
 * Mail
 * ↓


BUSCADOR

Buscar:

--------------------------------------------------------------------------------


FELICIDADES

 * Francisco Fuentes (36 añitos) de http://elblogdeffuentes.cl
 * Juan Manuel Lemus (38 añitos) de http://dotpress.wordpress.com
 * Daniela Figueiredo (49 añitos) de http://andarsemrumo.blogspot.com/
 * Isaies (34 añitos) de http://tutoriales-photoshop.es
 * Mas +


CONTENIDO


X-TAGS, CREA TUS PROPIOS ELEMENTOS HTML CON FUNCIONALIDAD JAVASCRIPT

30 Jul

aNieto2k hace 4281 días en: javascript, Programacion, webdev

+ 38

<x> o X-Tags, es una librería javascript que nos permitirá definir elementos
HTML propios cargados con la funcionalidad que deseemos de una forma fácil y
rápida.

La idea detrás de esta librería es que el diseño simplemente tenga que conocer
el elemento HTML a crear y su estructura. Además, se basa en el estandar de Web
Components y los Custom Elements, que nos permite definir elementos propios
contemplados en los estandares modernos. Hasta el momento, la mejor opción es
usar algún elemento HTML disponible e intentar que tenga algún sentido semántico
en nuestro código.

Por lo tanto, si nuestros maquetadores conocen el código HTML que hemos definido
previamente, por ejemplo este acordeón:


// HTML
<x-accordion>
    <x-toggler selected="true">Toggler 1</x-toggler>
    <div>Panel 1</div>
    
    <x-toggler>Toggler 2</x-toggler>
    <div>Panel 2</div>
    
    <x-toggler>Toggler 3</x-toggler>
    <div>Panel 3</div>
</x-accordion>


Nosotros solo tendremos que registrar el elemento con las características que
nosotros deseemos.


// Javascript
xtag.register('accordion', {
    onCreate: function(){
        // Se ejecutará cuando un elemento es creado o parseado
    },
    onInsert: function(){
        // Se ejecutará cuando un elemento es insertado en el DOM
    },
    events: {
        'click:delegate(x-toggler)': function(){
            // Se ejecuta cuando un toggler es ejecutado.
        }
    },
    getters: {
        'togglers': function(){
            // Devuelve todos los elementos togglers.
        }
    },
    setters: {
        // Añade Objetos DOM
    },
    methods: {
        nextToggler: function(){
            // Activa nuevo toggle
        },
        previousToggler: function(){
            // Activa el toggle previo
        }
    }
});


Y todo ello, siendo disponible para la mayoría de navegadores de escritorio y
todos los móviles. Ver más ejemplos

↑ Participa, Hay 38 Comentarios. →


USA MEDIA QUERIES PARA OCULTAR CSS3 A NAVEGADORES ANTIGUOS

27 Jun

aNieto2k hace 4314 días en: CSS, Programacion, webdev

+ 18

Siempre tendemos a condicionar nuestro CSS pensando en los navegadores antiguos,
haciendo uso de los condicionales o hacks para complementar las excepciones que
navegadores como IE6,7 requieren para funcionar «correctamente», pero … ¿y si
añadieramos como excepciones las funcionalidades más modernas?

Desde 456 Berea St., recomienda usar las media queries de CSS3 para unir el CSS
más moderno y solo será visible para los navegadores que las soporten, de esta
forma estamos cambiando el chip y optimizar el uso de los CSS’s en los
navegadores de los usuarios.


TÍPICO CSS


.block {
	width: 100%;
	position: fixed;
       -moz-border-radius:1em; // IE no lo detecta
       -webkit-border-radius:1em; // ...
      // ...
}


Imaginemos que entramos con IE y cargamos este CSS, si seguimos el proceso de
ejecución CSS secuencial deberemos evaluar cada una de las líneas aunque no las
tengamos soportadas. Esto, en grandes aplicaciones con miles de líneas de CSS en
navegadores antiguos pueden provocar lentitud (doy fé de ello).

Para solventar el problema y unificar el código «moderno» deberíamos cambiar el
chip y unificarlo de la siguiente forma.


USANDO MEDIA QUERIES


@media only screen {
	.block {
		-moz-border-radius:1em; // IE no lo detecta
		-webkit-border-radius:1em; // ...
		// ...
	}
}

.block {
	width: 100%;
	position: fixed;
}


De esta forma, IE no reconoce la palabra «only» del @media y omite el resto del
código incluido en su interior. De esta forma únicamente realizamos una sola
comprobación que omitirá o no dependiendo de las capacidades del navegador.

↑ Participa, Hay 18 Comentarios. →


JQUERY SE DESMIEMBRA PARA LA VERSIÓN 1.8

26 Jun

aNieto2k hace 4315 días en: javascript, Programacion, webdev

+ 8

jQuery da un paso en su personal evolución hacia la modularización de su código,
y en esta nueva versión podremos generar versiones personalizadas de la librería
excluyendo módulos que no necesitemos.

Entre los módulos que podremos excluir para esta nueva versión tenemos (ajax,
css, dimensions, effects y offset). Si no necesitas ninguno de estos módulos
puedes tener una versión de jQuery de solo 21KB (gzip). De esta forma podremos
convertir un cañon en el arma que realmente necesitamos para atacar el problema.

Otra mejora que nos encontraremos en esta nueva versión es la inclusión de
prefijos CSS automáticamente para evitarnos tener que añadir más líneas de las
necesarias, haciendo nuestro código más estandar y adaptado a las
especificaciones del futuro.

Y muchas cosas más…

[Descargar]

↑ Participa, Hay 8 Comentarios. →


STACKJS, FRAMEWORK JS PARA QUE LA ORIENTACIÓN A OBJETOS SEA MÁS FÁCIL

26 Jun

aNieto2k hace 4315 días en: javascript, Programacion, webdev

+ 3

StackJS es un framework más que nos ofrece las herramientas necesarias para
facilitarnos la tarea implementar mediante orientación a objetos en javascript.

Además de una serie de funcionalidades que le aportan robustez a nuestras
creaciones.


SETTERS Y GETTERS AUTOMÁTICOS

Automáticamente tendremos disponible métodos de insercción y consulta de todos
los atributos de la clase, lo que nos facilitará la tarea de trabajar con ellas.


Class('Car', {
	engineSize: null,
	model: null,
	manufacturer: null,
	maxSpeed: null,
	Car: function(manufacturer) {
		this.manufacturer = manufacturer;
	}
});

var car = new Car('Toyota');
car.setModel(2007); // Setter Automático
console.log(car.getManufacturer()); // Getter Automático



GESTIÓN DE ERRORES

La posibilidad de definir nuestras propias excepciones, condicionar
funcionamientos y lanzarlas cuando detectemos un problema nos permite una mayor
control de nuestro código.


Class('MyException::Exception',{
	test: null,
	MyException: function(test) {
		this.message = "Excepción lanzada";
		this.human = test;
	}	
});

Class('MiClass', {
	falla: function(){
		Throw(new MyException(this)); // Excepción
	}
});


var miKlass = new MiClass();

// Evento MyException
Catch('MyException', function(ex){
	console.log("Se ha producido una excepción controlada");
});

miKlass.falla();



DELEGACIÓN DE OBJETOS

Portado de ObjectiveC podemos vincular objetos delegando eventos entre ellos.


Class("Engine",{
	size: null,
	Engine: function(size) {
		this.size = size;
	},
	start: function() {
		this.callDelegate("didBrokenPart",[this]);	
	}
});

Class("Car",{
	engine: null,
	Car: function() {
		this.engine = new Engine(1600); // Creamos un nuevo Engine
		this.engine.setDelegate(this); // Delegamos el nuevo objeto creado
	},
	drive: function() {
		console.log("start drive");
		this.engine.start();
	},
	stop: function() {
		console.log("car is stopped");
	},
	didBrokenPart: function(object) {
		this.stop();
	}
});


Y todo en solo 3kb comprimdido.
[Descargar]

↑ Participa, Hay 3 Comentarios. →


VARIABLES CSS, ¿COMO ESTÁ EL TEMA?

18 Jun

aNieto2k hace 4323 días en: CSS, estandares, Programacion, webdev

+ 1

Hace ya 4 años que se vienen hablando de la inclusión de variables en nuestros
CSS, pero el tema parece que está bastante parado. Al parecer la W3C en abril
publicó un borrador en el que introducia una propuesta de como deberían
funcionar las estas variables en nuestros CSS’s.


// Definición
:root {
  var-my-color: #fad;
}

// Uso
.thing {
  color: var(my-color);
}


Desde WebKit hace ya tiempo que podemos usarlas usando el prefijo (-webkit-).


// Definición
:root {
  -webkit-var-my-color: #fad;
}

// Uso
.thing {
  color: -webkit-var(my-color);
}



Este mes de Junio, la W3C se marca un nuevo borrador en el que prescinde de la
función var() cambiándola por $ para llamar a nuestra variable.


// Definición
:root {
  var-my-color: #fad;
}

// Uso
.thing {
  color: $my-color;
}


Vamos, que la capacidad de que nuestros CSS’s dispongan de variables está más o
menos igual que siempre y no parece que se vaya a solventar en un futuro
cercano, por el momento deberemos seguir usando herramientas como LESS.js o SASS
para disponer de esta capacidad y alguna más.

Via

↑ Participa, Hay 1 Comentario. →


SIGMA.JS, DIBUJA GRÁFICAS USANDO CANVAS DESDE JAVASCRIPT

14 Jun

aNieto2k hace 4327 días en: javascript, Programacion, webdev

+ 3

El uso de canvas de HTML5 está dando lugar a herramientas tan interesantes y
sorprendente como Sigma.js, una librería que permite generar gráficas dinámicas
directamente desde javascript.


(Ver Imagen)

Entre las características que hacen de Sigma.js una librería interesante están:

 * La capacidad de encadenar métodos
 * Gestión de eventos personalizados
 * Posibilidad de añadir plugins, usar ficheros GEXF, algoritmos ForceAtlas2,…
 * Api sencilla y accesible
 * Pintado personalizado del mantenimiento del gráfico
 * Insercción mediante frames


COMO USARLO

Primero deberemos inicializar el objeto sigma con el contenedor DOM donde
incluiremos nuestro gráfico.


var sigInst = sigma.init(domElement);


El objeto resultante, nos permitirá comenzar a trabajar con el gráfico:


sigInst.addNode('hello',{
  'label': 'Hello'
}).addNode('world',{
  'label': 'World!'
}).addEdge('hello','world');


Los ejemplos pueden ayudar a ofrecer una idea más clara de las capacidades de la
librería. Descargar.

↑ Participa, Hay 3 Comentarios. →


QUOJS, MICRO LIBRERÍA JAVASCRIPT PARA SIMPLIFICAR TUS PROYECTO MÓVILES

7 Jun

aNieto2k hace 4334 días en: Asides, Movil, Programacion, webdev

+ 1

Está claro que el peso y las funcionalidades de las principales librerías
javascript (jQuery, MooTools, Prototype,…) no están actualmente alineadas a las
necesidades de una aplicación móvil, de ahí que no paren de salir versiones
minificadas y/concentradas con funcionalidades más específicas y focalizadas a
esa franja de dispositivos. QUOjs es una más, interesante por la facilidad con
la que puedes gestionar los eventos más comunes realizados con los dedos sobre
páginas web y por su peso, 13kb.[Descargar]

↑ Participa, Hay 1 Comentario. →


ON{X} , EXTIENDE LAS CAPACIDADES DE TU ANDROID CON JAVASCRIPT

7 Jun

aNieto2k hace 4334 días en: android, javascript, Programacion, webdev

+ 3

Microsoft, si Microsoft, ha desarrollado una interesante idea con la que nos
permite extender las capacidades de nuestro Android mediante una API Javascript.

Como se de una gestión de eventos básica se tratara on{X} nos permite definir
funcionalidades interesante cuando estos eventos se cumplan.


HOLA MUNDO

// Cuando desbloquee el móvil 
device. screen.on("unlock", function(){
     // Muestra el mensaje "Hello world!"
     var notification = device.notifications.createNotification('Hello world!');
     notification.show();
     console.log('Hello World notification was sent to the phone');
 });


On{X} está compuesto de una aplicación para Android que debes instalar en tu
dispositivo móvil y una aplicación web en la que al entrar con login de Facebook
podrás ver un listado de recipientes con tus controles definidos, estos
controles están continuamente sincronizados entre el móvil y la aplicación así
que es posible realizar cambios y verlos en vivo directamente en tu móvil.

Para desarrollar tus propios recipientes dispones de un editor online que
automáticamente almacenará el código y lo compartirá con tu dispositivo móvil.

De esta forma, planificarte tareas como «Enviar un mail a tu mujer diciéndole
que estás en el supermecado y si tienes que comprar algo concreto es el momento,
automáticamente cuando entras al supermercado» es posible, sencillo y lo que a
mi me gusta más, te lo puedes programar tu mismo!


EJEMPLOS

AVISAME SI HE DE COGER UN PARAGUAS EN EL PRIMER DESBLOQUEO DEL MÓVIL DE CADA
MAÑANA SI EL TIEMPO DICE QUE VA A LLOVER.


// Inicializamos variables

var reminder = "take an umbrella";
var weatherCondition = "rainy";

console.log('Started script: Remind me to ' + reminder + ' every day the first time I unlock my phone, if it is going to be ' + weatherCondition);

device.screen.on('unlock', function () {
	console.info('device unlocked');
	var lastDateScreenUnlocked = device.localStorage.getItem('lastDateScreenUnlocked');
	var today = new Date().toLocaleDateString();

	// Si es el primer desbloqueo
	if (!lastDateScreenUnlocked || lastDateScreenUnlocked !== today) {
		// Coger posición actual
		var locationListener = device.location.createListener('CELL', 2);
		locationListener.on('changed', function(locSignal) {
			locationListener.stop();

			// Carga el tiempo en función de la posición
			feeds.weather.get(
				{
					location: locSignal.location.latitude + ',' + locSignal.location.longitude,
					time: 0     
				},
				function onSuccess(weather, textStatus, response) {
					console.info('Got the weather forecast for today:', JSON.stringify(weather.forecasts[0]));

					// Compruemas las condiciones atmosféricas
					var forecast = weather.forecasts[0];

					if ((weatherCondition === 'rainy' && (forecast.rain > 50 || forecast.sky.toLowerCase() === 'rain')) ||      // Llueve
						(weatherCondition === 'sunny' && forecast.sky.toLowerCase() === 'clear') ||                                               // Soleada
						(weatherCondition === 'windy' && forecast.wind.speed  >= 20 && forecast.wind.speed < = 30)) {  // Viento
						// Creamos la notificación
						 var notification = device.notifications.createNotification(reminder);
						notification.on('click', function () {
							device.browser.launch(weather.forecastUrl);
						});
						// Mostramos el mensaje
						notification.show();
					} else {
						console.info('weather is not ' + weatherCondition );
					}
				},
				function onError(response, textStatus) {
					console.error('Failed to get weather: ', textStatus);
				});
		});

		locationListener.start();

		// Actualizamos el tiempo desde la última notificación
		device.localStorage.setItem('lastDateScreenUnlocked', today);
		console.info('Stored the last time the screen was unlocked: ', today);
	}
});
console.log('Completed script: Remind me to ' + reminder + ' every day the first time I unlock my phone, if it is going to be ' + weatherCondition);


Más ejemplos

↑ Participa, Hay 3 Comentarios. →


JQUERY++, PERSONALIZA TU LIBRERÍA JQUERY

7 Jun

aNieto2k hace 4334 días en: Asides, javascript, Programacion, webdev

+ 0

jQuery++ nace para solventar la problemática de cargar más javascript del
estrictamente necesario en nuestras aplicaciones web. Mediante esta aplicación
será posible añadir a tu jQuery una serie de herramientas con el tamaño mínimo
posible.[Via]

↑ Participa, Hay 0 Comentarios. →


CAN.JS, FRAMEWORK JS PARA ENRIQUECER TUS APLICACIONES WEB

6 Jun

aNieto2k hace 4335 días en: javascript, Programacion, webdev

+ 8

Can.js, es un framework creado para facilitar la creación de aplicaciones ricas
en javascript gracias a la integración de herramientas que nos permiten
gestionar el código que desarrollamos.

var Todo = can.Construct({
  init: function( text ) {
    this.text = text
  },
  read: function() {
    console.log( this.text );
  }
})
  
var todo = new Todo( 'Hello World' );
todo.read()

Facilitando las herramientas por separado nos permite definir nuestro propio
patrón de desarrollo o usar el típico y efectivo MVC para gestionar una gran
aplicación web.

 * can.Construct – Constructor de objetos javascript
 * can.Observe – gestión de eventos clave – valor
 * can.Model – Modelo de datos conectado via REST JSON
 * can.view – Motor de plantillas
 * can.EJS – Lenguaje propio de plantillas con helpers
 * can.Control – Directiva de control de eventos
 * can.route – Soporte de routing

Lo mejor de Can.js, es:

 * Tamaño, en solo 8.5kb dispones de las mismas herramientas que ofrecen otros
   frameworks.
 * Facilidad de uso, es una de las premisas por las que crearon este framework.
 * Seguridad, no acerca herramientas muy completas para gestionar nuestros
   objetos y evitar que la cosa se desmadre.
 * Velocidad, comparado con otros frameworks de similares capacidades promete
   mejores resultados en ejecuciones cruciales de desarrollo.
 * Flexibilidad, facil de implementar tus propios plugins para añadirles
   funcionalidades nuevas

Además, está disponible para las principales librerías javascript:

 * can.jquery.js (min) – 8.5k – Annotated Source
 * can.zepto.js (min) – 10.2k – Annotated Source
 * can.dojo.js (min) – 10.8k – Annotated Source
 * can.mootools.js (min) – 10.7k – Annotated Source
 * can.yui.js (min) – 10.2k – Annotated Source

↑ Participa, Hay 8 Comentarios. →

↑ ← Anterior

wordpress. themes wordpress.plugins wordpress.hacks Wordpress webkit usabilidad
tweet themes Safari prototype plugins plugin PHP optimización Opera navegadores
MooTools lightbox jquery.plugin jquery javascript itouch iphone internet
explorer imagenes IE8 IE6 HTML5 HTML hack google.chrome google framework flash
firefox3 firefox firebug estandares CSS3 CSS canvas ajax Accesibilidad 2.7 2.6


INFORMACIÓN


MI FLICKR

Ver más...


PROYECTOS

 * Foro aNieto2k Resuelve tus dudas sobre Wordpress
 * 10 Entrevistas de la blogosfera 10 personajes de la blogsfera entrevistados
 * heySilver Enriquece tu web con esta versión de QuickSilver
 * BlogoEdad La edad de los bloggers
 * Themes en Español Themes para Wordpress Castellano
 * iMeneame Meneame en tu iPhone
 * geekTest Demuestra lo Geek que eres
 * WpAdminThemes Crea y comparte tus propios Admin Themes


COMENTARIOS


POSTS MÁS RELEVANTES

 * La nueva pagina web oficial del CongresoLa "fanstástica" web del congreso.
 * Javascript no obstructivo, manual de buenas manerasSi hay que hacer las
   cosas, hagamoslas bien.
 * Las 10 mejores funciones de Javascript¿Por que desarrollarlas tu mismo?
 * Las páginas blancas de la seguridad en Wordpress Nunca está de más protegerse

--------------------------------------------------------------------------------


CRÉDITOS

aNieto2K · 2005·2024
Diseñado por Daniel Mota

Inicio / Recomendaciones / Contacto / RSS
Funciona gracias a Wordpress y jQuery

Esta web se encuentra sobre la licencia Creative Commons (Reconocimiento -
Compartir igual) / Políticas de uso

Google analytics