Más iconos gratuitos

Vía Blogultura me entero de zeus box, un blog que tiene una sección dedicada a compartir utilidades, como sets de iconos gratuitamente. Estos paquetes contienes iconos en formatos .ico y .png.

Free Icons

Crea tu avatar con Avatar Sizer

Avatar Sizer es una plicación para crear avatares (pequeñas imágenes), de manera rápida y fácil. Solo redimensiona una imagen, no la edita. Nos permite crear una avatar de diferentes tamaños, desde 1x1 píxeles hasta un máximo de 150x150 píxeles. Útil para tener nuestro avatar en foros, redes sociales, mensajería y más. Podemos obtener nuestro avatar en diversos formatos: jpg, gif, bmp, wmf, emf e ico.

Avatar Sizer

3 nuevos menús en CSS

Una lista de nuevos menús para todos los gustos! gracias a nuestros amigos de CSSPlay. 

1. Menú en forma hexagonal

Menu 1 

2. Menú lista desplegable

Menu 2 

3. Menú superior con sombras 

Menu 3

Gráficos 3D con Canvas

El autor de Dragan's Blog ha desarrollado una librería llamada canvas3DGraph.js que nos permite crear / mostrar gráficos 3D en una página HTML. Él nos explica que la etiqueta <canvas> no es soportada por IE (cuando no!). Así que teniendo en cuenta eso se ayudo de la librería excanvas.js para mostrar o trabajar sobre IE. Sobre Firefox y Safari los gráficos hechos con canvas van de maravilla (10 veces más rápido que IE).

Canvas 3D

El la página del proyecto podemos encontrar un ejemplo en tiempo real e información sobre como usar las librerías en nuestra páginas web. 

Enlaces | ¿Qué es canvas?

Resaltado de palabras después de usar Buscador (JavaScript)

La librería searchhi hace posible resaltar automáticamente palabras de una página web que son buscadas a través de los buscadores web. Para entender mejor esto, cuando un buscador nos arroja los resultados de cierta búsqueda, éste resalta la expresión buscada en negrita, y si hacemos clic en En caché lo resalta también con un color de fondo. Bueno es así como trabaja searchhi.

Resalta tus busquedas

Como usarlo

Descarga la librería, y en la página donde deseas que las palabras se resalten, agregas la siguiente línea.

 <script src="searchhi.js" type="text/javascript"></script>

Además en tu hoja de estilos agregas span.searchword (ó .searchword) y con el contenido "background-color: yellow", esto es para indicar el color con el cual se resaltará las palabras buscadas encontradas.

.searchword{
	background-color:yellow;
} 

Enlaces | Mas información y documentación

Edge.js, aplica una máscara a imágenes con JavaScript

La librería Edge.js combina Canvas y JavaScript para aplicar una imagen como máscara sobre otra imagen. Por regla: la imágen que aplicaremos como máscará debe ser PNG.

Edge.js

Como usarlo

<script type="text/javascript">
	var mask2load = new Array();
	mask2load[0] = "masks/8bit/crippleedge.png";
	mask2load[1] = "masks/8bit/frizzedge.png";
	mask2load[2] = "masks/8bit/softedge.png";
	mask2load[3] = "masks/8bit/splatteredge.png";
	mask2load[4] = "masks/8bit/waveedge.png";
</script>
// else only this line...
<script type="text/javascript" src="edge.js"></script>

Vía Ajaxian

Calendario con Mootools - JavaScript

Mootools CalendarHe aquí un interesante calendario elaborado con Mootools. La página del autor ofrece un ejemplo y documentación sobre las opciones que dispone. Además de los archivos necesarios: DataPicker.js y DataPicker.css. Necesitarán descargar la librería de Mootools v1.11 ó superior y algunas dependencias: Core, Class, Class.Extras, Array, String, Function, Number, Element, Element.Event, Element.Filters, Element.Selectors, Window.DomReady y Json.

Ejemplo

<html>
<head>
<title>MooTools DatePicker Ejemplo</title>

<link rel="stylesheet" href="DatePicker.css" type="text/css" />
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/DatePicker.js"></script>

<script type="text/javascript">
window.addEvent('domready', function(){
	$$('input.DatePicker').each( function(el){
		new DatePicker(el);
	});
});
</script>

</head>
<body>
<div>
	<h1>MooTools Date Picker</h1>
	<p>
		<label for="birthday">default calendar</label>
		<input readonly="readonly" id="birthday" name="birthday" class="DatePicker" tabindex="1" value="10/24/2016" type="text">
	</p>
	<p>
		<label for="new_day">calendar with all options</label>
		<input readonly="readonly" id="new_day" name="new_day" class="DatePicker" alt="{
			dayChars:3,
			dayNames:['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado'],
			daysInMonth:[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31],
			format:'dd-mm-yyyy',
			monthNames:['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Deciembre'],
			startDay:1,
			yearOrder:'desc',
			yearRange:90,
			yearStart:2007
		}" tabindex="1" value="02-08-2007" type="text">
	</p>
</div>
</body>
</html>

Desplazamiento interactivo de imágenes con Javascript

Corner Dock es una pequeña utilidad en Javascript que permite desplazarnos de manera interactiva a través de un grupo de imágenes. Por defecto la ubicación de las imágenes es en la esquina superior (por algo el nombre), aunque no he visto si eso se puede configurar.

Como usarlo

Después de descargar el paquete comprimido, referenciamos en nuestra página html, la hoja de estilos y el archivo Javascript.

<script language="JavaScript" src="js/CornerDock.js"></script> 
<link rel="stylesheet" href="css/CornerDock.css" type="text/css" />

Luego en un div (id=MiDiv) colocamos una serie de imágenes.

<div id="CornerDockDiv" style="border:1px solid red;"> 
	<!-- Each 'a' tag must have a unique ID and must contain one single 'img' tag --> 
	<a id="0" href="JavaScript:alert('You clicked icon 1');"><img  src="images/Chart.png" alt="" /></a> 
	<a id="1" href="JavaScript:alert('You clicked icon 2');"><img  src="images/Pie Diagram.png" alt="" /></a> 
	<a id="2" href="JavaScript:alert('You clicked icon 3');"><img  src="images/User.png" alt="" /></a> 
	<a id="3" href="JavaScript:alert('You clicked icon 4');"><img  src="images/Chat_01.png" alt="" /></a> 
	<a id="4" href="JavaScript:alert('You clicked icon 5');"><img  src="images/Class.png" alt="" /></a> 
	<a id="5" href="JavaScript:alert('You clicked icon 6');"><img  src="images/Contact.png" alt="" /></a> 
	<a id="6" href="JavaScript:alert('You clicked icon 7');"><img  src="images/Copy.png" alt="" /></a> 
	<a id="7" href="JavaScript:alert('You clicked icon 8');"><img  src="images/House.png" alt="" /></a> 
	<a id="8" href="JavaScript:alert('You clicked icon 9');"><img  src="images/Shopping cart.png" alt="" /></a> 
</div>

Creamos un Corner Dock, pasamos como parámetros el id del div que contiene nuestras imágenes, así como la altura y ancho de este. 

<script language="JavaScript">  
	window.CornerDock = new JSCornerDock('CornerDockDiv',300,800); 
</script>

El resultado final lo podemos apreciar aquí.

Hacer dinero online: más de 100 herramientas

Hacer dinero en Internet

Hacer dinero en internet es el sueño de muchas personas. Un sueño alcanzable ¿Porqué? Internet mueve millones $$$. Algunas 'personas' (no grandes corporaciones) han logrado vivir de ingresos generados gracias a internet. En realidad es posible, con mucho trabajo y dedicación. Existen muchas formas, tengamos una web o no (lo último es poco probable). Pero si estamos recién dando nuestros primeros pasos con nuestra Web, pues para ello existen herramientas o recursos que pueden ayudarnos a generar alguito de dinero. En Mashable encontramos una lista de estos (más de 100). Entre las categorías están: los que pagan por que tú escribas (artículos, opiniones), los programas de publicidad (publicidad contextual), programas de afiliados (promocionas productos y te pagan cierto porcentaje), programas de pago por medios sociales (pasa la voz a tus amigos de cierta web), etc. Allí están las herramientas, hay que aprenderlas a usar para ver resultados positivos.

Mas de 450 utilidades en Ajax, Javascript y Dhtml

Ajaxrain

AjaxRain es una web que muestra una serie de utilidades (ide, librerías, demos, ejemplos, código fuente) sobre Ajax, Javascript y Dhtml; de momento existen 485 utilidades y algo más. Así que si estamos por desarrollar un proyecto usando Javascript ó relacionados, debemos dar un paseo por este site muy bueno.

12 páginas : Anterior 1 ...4 5 6 7 8 ...12 Siguiente

Navegación

Categorias

Archivos