Si lee WebDesignTuts + con frecuencia, probablemente haya visto muchas referencias a ThemeForest, nuestro mercado para plantillas y temas web. Sin embargo, también existe la posibilidad de que visite CodeCanyon, el mercado hermano de ThemeForest, que vende fragmentos de código y complementos. CodeCanyon es un recurso bastante grande lleno de archivos útiles, interesantes y, bueno, para el desarrollo web que pueden ser un recurso sin explotar para ti.
CodeCanyon cubre una amplia gama de categorías diferentes, desde scripts PHP a complementos de WordPress hasta códigos para aplicaciones móviles. Hoy, vamos a echar un vistazo a dos categorías específicas, HTML5 y CSS, y algunos de los fragmentos de código atractivos que contienen. Si tienes algún favorito adicional de CodeCanyon, suelta algunos enlaces en los comentarios!
Solo una nota antes de que comencemos, todos los precios aquí suponen que está utilizando créditos prepagos. Si le apetece comprar solo uno o dos y no quiere invertir en créditos prepagos, agregue $ 2 al precio cotizado. Además, los conteos de compra son correctos al momento de escribir.
Vamos a dar inicio a nuestro resumen con algunos botones 100% CSS que se ven muy bien. Estos botones tienen un nombre adecuado ya que tienen un estilo similar al del repositorio de códigos GitHub. El archivo anuncia "clases fáciles", tiene un archivo de ayuda detallado y llega al precio bajo de solo $ 2. Con 88 compras, estos botones tienen la calificación más alta en toda la categoría de CSS con un total de cinco estrellas.
Siempre es bueno escribir redadas, porque encuentras algunas cosas muy buenas. Un ejemplo de esto es CSS3 Accordions, un paquete de acordeones horizontales y verticales de CSS puro en cuatro colores. Este archivo también tiene una calificación de cinco estrellas y una etiqueta de precio de $ 4, que brinda soporte para las versiones de Firefox de regreso a Firefox 2, e Internet Explorer a IE6 (y Opera, Safari y Chrome, por supuesto).
Este archivo es un simple reproductor de audio con tecnología HTML5 que reproduce archivos MP3 o OGG en todos los navegadores principales. Con la configuración anunciada como completada en menos de 3 minutos, y cuyo archivo javascript pesa solo 5 KB, este archivo de $ 6 es bastante bueno.
Si tiene la oportunidad, juegue con la demostración en vivo para apreciar el cuidadoso diseño y el ahorro de su estado de volumen en múltiples configuraciones.
Este archivo es un menú CSS3 bastante impresionante con iconos grandes que "HipHop" cuando se coloca el mouse. Aparentemente es fácil de implementar, y puede limitarse a mostrar la animación de salto o solo atenuar elementos de menú no desplazados si lo desea.
En cuanto a dónde lo usa, el menú es una pieza impresionante de código para usar en sitios de cartera, como un selector de productos o como un centro principal para vincular a subsitios. Con solo $ 2, es una oferta increíble y probablemente me la compre una vez que termine de escribir este artículo!
Antes de escribir para Tuts +, originalmente planeé publicar algunos archivos en los mercados, y una de mis primeras ideas fue un montón de efectos de desplazamiento de imagen. Si bien esa idea nunca llegó a buen término (estaba demasiado ocupada escribiendo sobre la validación de formularios), Pixelworkshop ha publicado un archivo impresionante mientras tanto. El archivo presenta 17 efectos de desplazamiento de imagen distintos por $ 5, que incluyen rotaciones de imágenes, superposiciones, cintas y otros efectos impresionantes. Asegúrese de revisar la vista previa del video en este!
Aunque no puedo ver una aplicación para la que podría usar este archivo, el efecto que genera es bastante bueno. Docklr CSS esencialmente replica la funcionalidad (es decir, la ampliación) del dock en Mac OS X pero dentro de una ventana del navegador. Docklr usa las transiciones de CSS para replicar las animaciones de OS X, como los iconos de rebote y la ampliación. Por solo $ 4, es un robo.!
Los cuadros de notificación son esencialmente un montón de cuadros de notificación, construidos con CSS, que se ven muy bien. Están bien diseñados, pero también cuentan con algunas animaciones agradables (con jQuery) cuando se despiden con un clic. Además, Notification Boxes admite las cookies de jQuery, lo que significa que cuando se descarta una notificación, no vuelve a aparecer al actualizar o volver a visitar la página..
Notification Boxes tiene un buen número de compras de 233 y se vende por solo $ 2..
Pricer es una de varias cuadrículas de precios hechas por CSS en CodeCanyon, y posiblemente una de las mejores. Pricer usa solo CSS puro para crear una cuadrícula de comparación de precios para comparar, por ejemplo, diferentes planes para un host web o múltiples niveles de membresía. Aunque no hay una vista previa de video, la lista promete animaciones basadas en CSS en navegadores compatibles (Safari 4+, Chrome 4+, Opera 10.5+, Firefox 4+) con "degradante elegante" en navegadores antiguos.
Con 13 combinaciones de colores diferentes, Pricer registra con un precio mínimo de $ 3.
Me he alejado de mencionar los menús desplegables para llegar al monstruo de ventas que es el "Menú Mega desplegable de CSS3" de Pixelworkshop (el creador de los mencionados "Efectos de desplazamiento de imagen de CSS3").
Con 3836 ventas, este archivo es el más comprado en todo el mercado de CodeCanyon. Básicamente, se trata de un menú desplegable válido que funciona con CSS3 y es compatible con varios navegadores en nueve colores. El archivo tiene una tonelada de opciones para personalizarlo, por lo que definitivamente es algo para echarle un vistazo, aunque es posible que sientas que es necesario agregar tu propio CSS para refinar un poco el diseño..
Este archivo de $ 4 cuenta con once sombras de generación CSS, incluyendo deformar, desplazar y plegar las que parecen bastante impresionantes. Es uno de esos archivos simples que siempre es útil tener en tu arsenal, y apenas cuesta un centavo hacerlo.
La paginación a veces puede ser subvaluada, pero en realidad proporciona una navegación esencial a un blog. "CSS Pagination Pack" es un paquete de elementos de paginación que funcionan con CSS en siete colores.
Esta paginación de $ 2 se genera con un código semántico y fácil de entender. El archivo se entrega con documentación completa si necesita ayuda, pero todo lo que realmente necesita es el ejemplo de uso simple que se proporciona en la descripción del artículo..
Es difícil ignorar la genialidad de este archivo, que genera gráficos de barras muy agradables con CSS y HTML puros, completos con estados flotantes. Los gráficos resultantes ciertamente no son inferiores considerando que no usan ninguna imagen. Francamente, $ 3 es una ganga para un archivo tan genial!
La Galería de videos HTML5 con Live Playlist es un reproductor de videos HTML5 estéticamente agradable y bien animado que también contiene un componente de lista de reproducción. El archivo funciona con archivos OGV y MP4 e incluso contiene Flash Fallback para los navegadores que no admiten video HTML5. Puedo confirmar que el archivo funciona perfectamente en un iPad también!
La galería de videos HTML5 con lista de reproducción en vivo cuesta $ 8 de CodeCanyon.
Elitepack Classic CSS3 Tags es un paquete de estilos bien diseñados para etiquetas de correos, compatible en todos los navegadores. Con varios esquemas de color diferentes, con estados flotantes y una implementación semántica, el archivo es bastante bueno.
Las etiquetas Elitepack Classic CSS3 están etiquetadas (sin juego de palabras) con solo un precio de $ 3.
Como puede ver, CodeCanyon contiene algunos archivos de código CSS y HTML5 que pueden funcionar bien para un proyecto actual o futuro. Sin embargo, este no es el límite de lo que ofrece CodeCanyon, así que asegúrese de navegar por sus archivos..
Si tiene otros archivos favoritos de CodeCanyon, asegúrese de compartirlos en los comentarios!