18个非常棒的jQuery代码片段(2)

$(window).bind("load", function() { // IMAGE RESIZE $('#product_cat_list img').each(function() { var maxWidth = 120; var maxHeight = 120; var ratio = 0; var width = $(this).width(); var height = $(this).height(); if(width > maxWidth){ ratio = maxWidth / width; $(this).css("width", maxWidth); $(this).css("height", height * ratio); height = height * ratio; } var width = $(this).width(); var height = $(this).height(); if(height > maxHeight){ ratio = maxHeight / height; $(this).css("height", maxHeight); $(this).css("width", width * ratio); width = width * ratio; } }); //$("#contentpage img").show(); // IMAGE RESIZE });

12、鼠标滑动时的渐入和渐出

$(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 }); });

13、制作等高的列

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

14、图片预加载

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

15、获取 URL 中传递的参数

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

16、禁用表单的回车键提交

$("#form").keypress(function(e) { if (e.which == 13) { return false; } });

17、让整个DIV可以被点击

<div class = "myBox" > < a href = "https://www.jb51.net" > < /a> </div > $(".myBox").click(function(){ window.location=$(this).find("a").attr("href"); return false; });

18、在新窗口打开链接 (target=”blank”)   

$('a[@rel$='external']').click(function(){ this.target = "_blank"; });

大家可以结合之前小编整理的文章进行学习，把实用的jQuery代码片段进行汇总，以便日后学习使用。

您可能感兴趣的文章: