Creando un simple sliding portfolio jquery

Saludos Amigos esta vez les traigo un simple sliding portfolio jquery , que va a mostrar en secciones con imágenes cada proyecto creado, para ser mostrado al usuario de una manera amigable y agradable. Para esta demo se utiliza los siguientes archivos: style.css main.js modernizr.js jquery.js (v2.1.1) index.html Comenzaremos estructurando nuestro index.html , la estructura se compone de 2 listas desordenadas. ul.cd-projects-previews .- para mostrar las imágenes previas a cada proyecto. ul.cd-projects .- para mostrar el detalle de cada proyecto. nav.cd-primary-nav .- Que es una barra de navegación envuelta en…

Seguir Leyendo

CSS Grid VS Flexbox : una comparación práctica

En esta publicación vamos a realizar una comparación rápida entre css grid vs flexbox, creando una plantilla sencilla y comparandolas. No hace mucho tiempo, el diseño de todas las páginas HTML se realizaba a través de tablas, flotantes y otras propiedades CSS que no eran adecuadas para el diseño de páginas web complejas. Luego vino flexbox – un modo de diseño que fue específicamente diseñado para crear páginas robustas y receptivas. Flexbox hizo que sea fácil alinear correctamente los elementos y su contenido, y ahora es el sistema CSS preferido de la mayoría de…

Seguir Leyendo

Creando Triangulos con Css.

Cualquiera que haya tratado de hacer flechas  HTML, globos de texto u otros elementos puntiagudos, sabe que creando triángulo con CSS tiene que utilizar algún tipo de truco. Las dos soluciones más populares para crear triángulos son : #triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } // y lo mostramos en una capa <div id=”triangle-up”></div> , o para utilizar Caracteres Unicode  . U+25B2 //Triangulo negro UP U+25BC //Triangulo negro DOWN // y asi utilizando todos los simbolos Unicode Html Hay…

Seguir Leyendo

Tabla de precio html responsive para web..

Hoy nos gustaría compartir una tabla de precio html responsive para web. Las Tablas de precios son un componente esencial en las páginas web donde se ofrecen servicios digitales. Mientras que parece que hay un patrón común, hay infinitas posibilidades de estilo. Esta demo muestra algunas ideas puede hacer uso de la que mas le convenga. Hay que tener en  cuenta que las propiedades CSS utilizadas en esta tabla de precio html responsive para web que citamos en esta publicación sólo funcionan en los navegadores modernos y actualizados. Aqui citamos la…

Seguir Leyendo

Bootstrap | proyectos listos para ahorrarnos tiempo..

Esta vez vamos a publicar unos recursos prácticos hechos con el framework Bootstrap que podría utilizar en sus próximos proyectos a realizar .Estos le ayudarán a minimizar documentación de Bootstrap ya que se encuentran listos para copiar y pegar dentro de su proyecto … Espero que disfruten de las siguientes plantillas.. Tablas de precios responsive.. Si de mostrar variaciones de precios en tablas se trata , esta es una buena opción .Es fácil de adaptar y personalizar adaptarse a su diseño no es complicado.   Lista de estilo personalizada ..…

Seguir Leyendo

Timeline(Línea del tiempo) responsive Css con efecto 3D

En este artículo experimentaremos un timeline responsive css 3d con la perspectiva y el uso de un truco de entrada de radio para crear una estructura de toque de un solo clic con css. La idea es mostrar un post de un artículo y al hacer clic en la entrada de radio asociada, el contenido se expandirá y girará en 3D, dándole profundidad a todo el asunto. Estaremos usando CSS transformación 3D, transiciones y selectores asociados. Algunos archivos utilizados en este demo no se publicarán pero los enlaces a sus…

Seguir Leyendo

Formulario autorespondedor sendmail php html5 css3

Este es un formulario autorespondedor de correo php para web que se podrá adaptar a sus necesidades solo debeán modificar sus correo y si desean podrán enviar una copia a otro mail ,existen varias funciones dentro del archivo php que realiza la consulta del formulario Necesitaremos de unos cuantos ,archivos hay que tener en cuenta que la realización de este archivo se tomó el formulario y se lo modificó para dar una mejor experiencia html5 css3 , o si bién deseas podrás modificar el formulario y dejar la funcion de…

Seguir Leyendo