jQuery 一些方法技巧

//1. 去除页面的右键菜单
$(document).ready(function() {
	$(document).bind("contextmenu", function(e) {
		returnfalse;
	});
});


//2.当鼠标获得焦点、失去焦点的时候,input输入框文字处理:
$(document).ready(function(){ 
	$("input.text1").val("Enter your search text here");
	textFill($('input.text1'));
	}
);

function textFill(input){
	var originalvalue = input.val();
	input.focus(function(){
		if( $.trim(input.val())== originalvalue ){ 
			input.val("");
			}
		}
	); 
	input.blur(function(){
		if( $.trim(input.val())==""){ 
			input.val(originalvalue);
			}
		}
	);
}



//3、轻松切换css样式
$(document).ready(function(){ 
	$("a.Styleswitcher").click(function(){
		//swicth the LINK REL attribute with the value in A REL attribute 
		$('link[rel=stylesheet]').attr('href', $(this).attr('rel'));
		}
	);
	}
);
// place this in your header
 <link rel="stylesheet" href="default.css" type="text/css">
 // the links 
 <a href="#" rel="default.css">Default Theme</a> 
 <a href="#" class="Styleswitcher" rel="red.css">Red Theme</a> 
 <a href="#" class="Styleswitcher" rel="blue.css">Blue Theme</a>




//4、高度相等的列
//如果您使用两个CSS列,以此来作为他们完全一样的高度
$(document).ready(function(){
	function equalHeight(group){ 
		tallest =0; 
		group.each(function(){ 
			thisHeight = $(this).height();
			if(thisHeight > tallest){ 
				tallest = thisHeight;}
			}
		); 
		group.height(tallest);
	}
	// how to use 
	$(document).ready(function(){ 
		equalHeight($(".left")); 
		equalHeight($(".right"));
		}
	);
}
);
 
//5、简单字体变大缩小
$(document).ready(function(){
	// Reset the font size(back to default) 
	var originalFontSize = $('html').css('font-size'); 
	$(".resetFont").click(function(){ 
		$('html').css('font-size', originalFontSize);
		}
	);
	// Increase the font size(bigger font0) 
	$(".increaseFont").click(function(){
		var currentFontSize = $('html').css('font-size');
		var currentFontSizeNum = parseFloat(currentFontSize,10);
		var newFontSize = currentFontSizeNum*1.2; 
		$('html').css('font-size', newFontSize);
		returnfalse;
		}
	);
	// Decrease the font size(smaller font) 
	$(".decreaseFont").click(function(){
		var currentFontSize = $('html').css('font-size');
		var currentFontSizeNum = parseFloat(currentFontSize,10);
		var newFontSize = currentFontSizeNum*0.8; 
		$('html').css('font-size', newFontSize);
		returnfalse;
		}
	);
	
	}
);

//6、获取鼠标位置
$().mousemove(function(e){
	//display the x and y axis values inside the div with the id XY 
	$('#XY').html("X Axis : "+ e.pageX+" | Y Axis "+ e.pageY);
	}
);


//7、判断一个元素是否为空
if($('#id').html()){
	// do something 
}

//8、替换元素
$('#id').replaceWith(' <div>I have been replaced</div> ');

//9、判断元素是否存在
$(document).ready(function(){
	if($('#id').length){
		// do something 
	}
}
);


//10、关闭jquery动画效果
$(document).ready(function(){ 
	jQuery.fx.off=true;
	}
);

//11、使用自己的jquery标识
$(document).ready(function(){
	var $jq = jQuery.noConflict();
	$jq('#id').show();
}
);
 

//12、设置div在屏幕中央
$(document).ready(function(){ 
	jQuery.fn.center=function(){
		this.css("position","absolute");
		this.css("top",( $(window).height()-this.height())/2+$(window).scrollTop()+"px");
		this.css("left",( $(window).width()-this.width())/2+$(window).scrollLeft()+"px");
		return this;
		};
	$("#id").center();
	}
);
 
 
原文地址 jquery http://www.jqueryba.com/170.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值