Shulou(Shulou.com)06/02 Report--

This article shows you what 10 great jQuery code snippets are, concise and easy to understand, which will definitely brighten your eyes. I hope you can gain something through the detailed introduction of this article.

Picture preloading

(function ($) {var cache = []; / / Arguments are image paths relative to the current page. PreLoadImages = function () {var args_len = arguments.length; for (var I = args_len; iMurray;) {var cacheImage = document.createElement ('img'); cacheImage.src = arguments [I]; cache.push (cacheImage);} jQuery.preLoadImages ("image1.gif", "/ path/to/image2.png")

Open a link in a new window (target= "blank")

$('a [@ rel$='external']') .click (function () {this.target = "_ blank";}); / * Usage: catswhocode.com * /

Add class to body when JavaScript is supported

/ * the code is only 1 line long, but the simplest way to detect whether the browser supports JavaScript is to add a class * / $('body'). AddClass (' hasJS') of hasJS to the body element if JavaScript is supported.

Scroll the page smoothly to an anchor point

$(document) .ready (function () {$("a.topLink") .click (function () {$("html, body"). Animate ({scrollTop: $($(this) .attr ("href")). Offset (). Top + "px"}, {duration: 500, easing: "swing"}); return false );})

Gradual entry and exit when the mouse is slid

$(document) .ready (function () {$(".thumbs img") .fadeTo ("slow", 0.6); / / This sets the opacity of the thumbs to fade down to 60% when the page loads $(".thumbs img") .hover (function () {$(this) .fadeTo ("slow", 1.0) / / This should set the opacity to 100% on hover}, function () {$(this) .fadeto ("slow", 0.6); / / This should set the opacity back to 60% on mouseout});})

Make columns of equal height

Var max_height = 0; $("div.col") .each (function () {if ($(this). Height () > max_height) {max_height = $(this). Height ();}); $("div.col") .height (max_height)

Enable HTML5 support on some older browsers

(function () {if (! / * @ ccroomonically accurate roommates beat 0) return; var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video" .split (','), iExhibit. Document.createElement (e [I])}) () / then introduce the js into head.

Test whether the browser supports some CSS3 properties

Var supports = (function () {var div = document.createElement ('div'), vendors =' Khtml Ms O Moz Webkit'.split (''), len = vendors.length; return function (prop) {if (prop in div.style) return true; prop = prop.replace (/ ^ [a murz] /, function (val) {return val.toUpperCase ();}) While (len--) {if (vendors [len] + prop in div.style) {/ / browser supports box-shadow. Do what you need. / / Or use a bang (! To test if the browser doesn't. Return true;}} return false;};}) (); if (supports ('textShadow')) {document.documentElement.className + =' textShadow'

Get the parameters passed in URL

UrlParam = function (name) {var results = new RegExp ('[\\? &]'+ name +'= ([^ & #] *)') .exec (_ window.location.href); if (! results) {return 0;} return results [1] | | 0;}

Disable the enter key submission of the form

$("# form") .keypress (function (e) {if (e.which = = 13) {return false;}}); what are the 10 great jQuery code snippets? have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.