Entradas

Mostrando las entradas etiquetadas como efecto

Poner en negritas parte de un texto en una página

Imagen
Este efecto lo he visto en un sitio llamado DePeru.com en sus noticias hay un texto que no está en negrita con la etiqueta <strong> o <b> sino que se convierte en negrita gracias a Jquery (en el código fuente). El uso de este efecto se puede trasladar a muchos otros escenarios donde podríamos necesitar cambiar los estilos para nuestras páginas. Para este caso el webmaster ha detectado que todos sus textos tienen un <p> que empieza con una raya (o guión) ... visto desde el código fuente por supuesto. <p>- Multiplicar el impacto -</p> Para cualquier otra aplicación podría ser un <h1>, <a>... etc El truco es simple, debajo de la llamada al archivo Jquery externo y antes de finalizar el body agregar el script : <script> $( ".contenido p:contains('- ')" ).css( "font-weight","bold" ); </script> </body> </html> Dónde :     .contenido es el class que contiene al texto, lu

69 imágenes para efecto Cargando

Imagen
Muchos webmasters usan imágenes para las áreas de espera de carga de sus páginas, formularios, imágenes, etc. Esta es una galería de imágenes que les servirá de mucha utilidad. Se pueden utilizar con cualquier hoja de estilos (css), JS o jQuery.

Efecto Cargando Página con jQuery

Imagen
imagen para esperar Algunas páginas son muy lentas y necesitan que le agreguemos el tradicional efecto de cargando en texto o el gif animado mostrado a la izquierda. Para los que conocemos html nos resulta conocido los DIV con el texto «cargando», así que vamos a ver como con unas cuantas líneas podemos llevar a cabo este efecto. Este ejemplo es útil para una página que tarda demasiado en cargar, y usaremos un link a un archivo externo jQuery, un JS y un DIV. Los siguientes pasos es entre las etiquetas HEAD: PASO 1: Agregar el archivo jQuery externo: <script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js "></script> PASO 2: agregar debajo el script siguiente: <script> $(window).load(function () { $('#cargando').hide(); }); </script> PASO 3: agregar los estilos: <style type="text/css"> #cargando { width:350px; height:70px; clear:both; background-colo