website stats » 2007 » July | Solo Código |

Validar que un campo se encuentre vacío

Escrito por J.F. el Tuesday, 31 de July del 2007 a las 15:15

Un script muy simple para hoy. Validar que existe un campo vacío, a pesar de que se haya pulsado la barra espaciadora, gracias a Javascript:

TEXTO PLANO
HTML:
  3. <script language="JavaScript">
  4. <!--
  5. function verificar()
  6. {
  7. if(form1.nombre_campo.value.replace(/ /g, '') == '')
  8. {
  9. alert("Debe Ingresar un valor ");
  10. form1.nombre_campo.focus();
  11. form1.nombre_campo.select();
  12. return false;
  13. }
  14. }
  15. -->
  16. </script>
  17. <title>Validar Campo Vacio</title>
  18. </head>
  20. <form name="form1">
  21. <input name="nombre_campo" type="text" size="15" maxlength="15">
  22. <input type="button" name="Validar" value="Validar" onclick="verificar()">
  23. </form>
  24. </body>
  25. </html>

Comentarios (4)

Categoria: Javascript

Little Boxes, más códigos CSS para maquetar

Escrito por J.F. el Monday, 30 de July del 2007 a las 15:19

Little Boxes es otra página web con un gran diseño gráfico, en la cual podrás encontrar códigos CSS ya montados, disponibles para maquetar tu página. Los hay de varias columnas, tanto juntas como separadas, diseños centrados, etc.

Little Boxes

Enlace: | Little Boxes

Escribir comentario

Categoria: Recursos

Templates HTML+CSS y Templates Flash

Escrito por J.F. el Sunday, 29 de July del 2007 a las 15:00

TemplatesSi lo tuyo no es diseñar tu propia página web desde 0, no tienes por qué resignarte a poseer una página austera, sin mucho color y una apariencia simple. Gracias a Internet disponemos de cientos de páginas desde las cuales podemos descargas Templates o Plantillas ya hechas para elaborar nuestro sitio web. La cosa consiste en escoger una que no guste, y o bien nos quedamos con ella tal cual está, o podemos optar por comenzar a sustituir imágenes, retocar aspectos en la hoja de estilos, añadir más opciones etc. Por ello he hecho una recopilación de 50 Templates que me agradan, y que quisiera compartir. Todos ellos los he conseguido seleccionándolos de algunas páginas que ofrecen plantillas gratuitas, y las condiciones de uso y licencia de cada plantilla se encuentran explicadas en un archivo de texto. Todas ellas vienen con sus imágenes, y hojas de estilos correspondientes. También he incluido algunas plantillas Flash, a pesar de que no sean sitios que me gusten aquellos diseñados unicamente con Flash, ésto del diseño web es cuestión de gustos, y en algún caso determinado queda muy elegante y vistoso.

Si le resulta útil el pack de templates, puede considerar realizar una simbólica donación, más de 10.000 personas descargaron el pack:



Descarga: | 50 Plantillas HTML+CSS y Flash gratuitas | Mirror
También recomiendo: | Descargar pack de iconos variados

Comentarios (62)

Categoria: CSS,HTML,Recursos

Crear el efecto de un libro con Javascript

Escrito por J.F. el Saturday, 28 de July del 2007 a las 14:55

Libro Javascript con JqueryVía Infected-FX me topo con un interesante ejemplo realizado mediante Javascript con el uso de la librería Jquery. Jquery es una librería Javascript que simplemente has de incluir como cualquier script que se encuentra en una hoja aparte para comenzar a utilizarla. El efecto es muy curioso y la verdad que resulta bastante vistoso, así que si deseas implementar éste sistema, aquí tienes el ejemplo del libro funcionando y su código. En la demo que puedes ver en el anterior enlace el libro que aparece es demasiado pequeño pero si te fijas en los comentarios parece que puedes poner el tamaño que desees a tu gusto. Copio y pego el código tal cual de la página:

TEXTO PLANO
JavaScript:
  1. <script type="text/javascript" src="jquery.js"></script>
  2.  
  3. <script type="text/javascript">
  4.  
  5. // set constants
  6. var $pageheight = 189; // our single page height
  7. var $pagewidth = 146; // our single page width
  8.  
  9. var $pageYpos = 0; // current Y position of our bg-image (in both pages)
  10.  
  11. $(document).ready(function(){ // When the page is ready
  12.  
  13. /* left page turner */
  14. $("#leftpage").click( function() {
  15. $pageYpos = $pageYpos + $pageheight; // update Y postion
  16. $("#leftpage").css("background-position", "0px "+$pageYpos+"px");// move the background position
  17.  
  18. setTimeout ('$("#flip").css("background-position", "top center");', 200);
  19. setTimeout ('$("#rightpage").css("background-position", "146px "+$pageYpos+"px");', 200);
  20.  
  21. }); // close leftpage click function
  22.  
  23. /* right page turner */
  24. $("#rightpage").click( function() {
  25. $pageYpos = $pageYpos - $pageheight; // note: minus page height
  26. $("#rightpage")
  27. .css("background-position", "0px "+$pageYpos+"px");
  28.  
  29. $("#flip").css("background-position", "top left");
  30. setTimeout ('$("#flip").css("background-position", "top center");', 200);
  31. setTimeout ('$("#leftpage").css("background-position", "146px "+$pageYpos+"px");', 200);
  32.  
  33. }); // close rightpage click function
  34. }); // close doc ready
  35.  
  36. </script>

Comentarios (3)

Categoria: Curiosidades,Javascript

Menú personalizado al pulsar botón derecho

Escrito por J.F. el Saturday, 28 de July del 2007 a las 13:39

En ésta ocasión vamos a ver como sustituir el menú normal de una página web al pusar el botón derecho, por un menú que puede ser de navegación con distintas opciones, elaborado por nosotros mismos. Para ello voy a usar un script que me encontré en MetodoVT, el cual he modificado para adaptarlo un poco más a mi gusto. Para hacerlo funcionar tan solo hay que seguir los siguientes pasos:
El script está en una hoja javascript a parte, por lo que enla página que vayamos a utilizar el menú, deberemos hacer la llamada e incluir dicho script. De la siguiente manera lo conseguimos, incluyendo las siguientes líneas en el head:

TEXTO PLANO
HTML:
  1. <script src="escript1.js"></script>

Para darle formato al menú, definimos unos cuantos estilos CSS, que puedes modificar tranquilamente a tu gusto, mejorando la apariencia con imágenes, etc.

TEXTO PLANO
CSS:
  1. <style>
  2. .contenedor{
  3.  display:none;position:absolute;z-index:99999999;
  4.  width:200px;height:auto;color:#FFFFFF;
  5.  background-color: #999999;
  6. }
  7.  
  8. .contenedor a{width:200px;height:25px;
  9.  color:#FFFFFF;font-weight: bold;
  10.  text-decoration: none;
  11. }
  12.  
  13. .contenedor a:alink,a:vlink{
  14.  width:200px;color:#FFFFFF;
  15.  font-weight: bold;
  16. }
  17.  
  18. .contenedor a:hover{
  19.  width:190px;color:#FFFFFF;
  20.  font-weight: bold;text-decoration:underline;
  21. }
  22. .titulo{
  23.  text-align: center;
  24.  font-weight: bold;
  25.  width:200px;
  26.  *width:220px;/*Para IE*/
  27.  background-color: #075181;
  28.  color: #FFFFF;
  29. }
  30. li{
  31.  padding-left: 5px;
  32. }
  33. </style>

Una vez seguidos éstos pasos, tan solo debemos ver la parte html, la cual podremos modificar todo lo que queramos exceptuando el <div id="pmenu" class="contenedor"> que es el que permite que funcione el menú contextual. Aquí está el código:

TEXTO PLANO
HTML:
  1. <div id="pmenu" class="contenedor">
  2. <div class="titulo">Informática Práctica</div>
  3. <li><a href="http://pagina1.com">Link 1</a></li>
  4. <li><a href="http://pagina2.com">Link 2</a></li>
  5. <li><a href="http://pagina3.com">Link 3</a></li>
  6. </div>

Para obtener el script, y ya de paso ver un ejemplo puedes descargartelo, y comenzar a modificar a tu gusto.
Descarga: | Menú personalizado con Javascript al pulsar botón derecho.

Comentarios (2)

Categoria: CSS,Javascript

Recursos para CSS, Menús desplegables, themes

Escrito por J.F. el Friday, 27 de July del 2007 a las 21:34

Bueno señores, guarden bien éstas 2 direccioens entre sus favoritos, puesto que son 2 páginas web con multitud de recursos hechos mediante CSS para implemente en nuestras páginas web. Veamos los sitios web en cuestión, y algunos de los múltiples ejemplos que ofrecen:

www.cssplay.co.uk: página web con montones de menús variados de todo tipo. También disponen de Layouts y Boxes. Particularmente lo que más me gusta son los menús de navegación. Los hay de todo tipo, horizontales,verticales, solo texto, con imágenes, deplegables de varios niveles, etc. Algunos ejemplos que me han gustado en un rápido vistazo:

www.dynamicdrive.com: Ésta página ya tiene más variedad. También tiene muchos menús, y además hay otros elementos como formularios y plantillas. Algunos ejemplos rápidos:

Comentarios (2)

Categoria: CSS,Herramientas online,Recursos

Solo Código

Solo Código es una colección de códigos de todo tipo que pueden resultar útiles para el diseño de páginas web. Está enfocado tanto para aquellos que son expertos, como para aquellos principiantes que quieren encontrar recursos útiles, o no saben implementar determinadas funciones en sus webs. No olvides que Solo Código es un blog de Informática Práctica, donde tenemos otras secciones interesantes como:
| Tutoriales | Trucos | Software | Links | Buscar |