La potencia de los framework de Javascript son algo que todos conocemos, pero realmente poca gente la domina de tal manera que la puede aprovechar. Estos 5 trucos permite demostrar que jQuery es fácil y potente.
Enlaces externos
En una sola línea podemos sacar todos los enlaces externos de la página y insertarlos dentro de un <span></span>
personalizado con la clase External.
$("a").not("[
href^=/]").not("[
href^=#]").append("<span class=\"External\">^</span>");
Usa tus propios puntos.
Si estas cansado de los típicos circulos y cuadrados en tus listas, puede reemplazarlo por cualquier cosa que te guste más con este pequeño código.
//Javascript$("ul").addClass("Replaced");
$("ul > li").prepend("‒ ");
//CSS
ul.Replaced {list-style : none;}
Cambia de hoja de estilos dinámicamente
Alterna entre varias hojas de estilos mediante unas líneas de código.
$("#StyleContrast").click(function() { $("link[
media='screen']").attr("href", "Contrast.css"); }); $("#StylePrint").click(function() { $("link[
media='screen']").attr("href", "Print.css"); }); $("#StyleNormal").click(function() { $("link[@media='screen']").attr("href", "Normal.css"); });
Cambia/Escribe el «Buscar …»
Usando el evento focus de un input podremos cambiar el texto de «Buscar…» a la hora de acceder a él.
$("#SearchText").focus(function() {
if (this.value == "Buscar...") {
this.value = "";
}
});
Altera el primer párrafo
Mediante el uso de los selectores CSS podemos acceder a los elementos deseados desde jQuery y en este caso accedemos al primer párrafo despues de un título <h2></h2>.
$("h2 + p").addClass("Large");
Truco extra
Sobran las palabras…
if ($.browser.msie) {
alert("IE Sucks!!!");
}
2 comentarios, 1 referencias
+
#