// chinacoder.cn JavaScript Document
$(
document).
ready(
function() {
//.filter(":not(:has(.selected))") //去掉所有不包含class为.selected的元素
// 使用has()来判断一个元素是否包含特定的class或者元素
$(
"input").
has(
".email").
addClass(
"email_icon"
);
//使用jQuery切换样式
$(
"link[media='screen']").
attr(
'href',
'Alternative.css');
//设置IE指定的功能
if (
$.
browser.
msie) {
/*Internet Explorer is a sadist.*/ };
//创建元素时使用对象来定义属性
var
e =
$(
"", {
href:
"#",
class:
"a-class another-class",
title:
"..." });
//使用过滤器过滤多属性
var
elements =
$(
'#someid input[type=sometype][value=somevalue]'
).
get();
//隐藏包含特定值的元素
$(
"p.value:contains('thetextvalue')").
hide();
//关闭右键的菜单
$(
document).
bind(
'contextmenu',
function(
e){
return
false
; });
//指定时间后自动隐藏或者关闭元素(
setTimeout(
function() {
$(
'.mydiv').
hide(
'blind', {},
500)},
5000);
//And here's how you can do it with 1.4 using the delay() feature (this is a lot like sleep)
$(
".mydiv").
delay(
5000).
hide
(
'blind', {},
500);
//元素屏幕居中
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;
}
//Use the above function as: $('#gbin1div').center();
//使用 jQuery 判断对象是否隐藏
if(!
$(
"#demo").
is(
":visible")){
}
if(
$(
"#demo2").
css(
"visibility") ==
"hidden" ){
}
//使用 jQuery 重定向页面
window.
location.
replace(
"http://www.baidu.com");
window.
location
.
href =
"http://www.baidu.com" ;
//Google AJAX 库加载 jQuery 的最好方法
if (
typeof
jQuery ==
'undefined') {
document.
write(
unescape(
"%3Cscript src='/js/jquery-1.7.2.min.js' type='text/javascript'%3E%3C/script%3E"));
}
//jQuery实现图片预览
xOffset =
10;
yOffset =
30;
$(
"#imglist").
find(
"img").
hover(
function(
e) {
$(
"<img id='imgshow' src='" +
this.
src +
"' />").
appendTo
(
"body");
$(
"#imgshow") .
css(
"top", (
e.
pageY -
xOffset) +
"px")
.
css(
"left", (
e.
pageX +
yOffset) +
"px")
.
fadeIn(
"fast"
);
},
function() {
$(
"#imgshow").
remove();
});
$(
"#imglist").
find(
"img").
mousemove(
function(
e) {
$(
"#imgshow") .
css
(
"top", (
e.
pageY -
xOffset) +
"px")
.
css(
"left", (
e.
pageX +
yOffset) +
"px")
});
//翻转
$(
'.banner').
find
(
'a').
hover(
function(){
$(
this).
find(
'.img1').
stop().
animate({
'width':
0,
'left':
'116px'},
110,
function(){
$(
this).
hide
().
next().
show();
$(
this).
next().
animate({
'width':
'232px' ,
'left':
'0'},
110);
});
},
function(){
$(
this).
find(
'.img2'
).
animate({
'width':
0,
'left':
'116px'},
110,
function(){
$(
this).
hide().
prev().
show();
$(
this).
prev().
animate({
'width':
'232px'
,
'left':
'0px'},
110);
});
});
});
//插件架构
/*
* jQuery-anipadding-0.1.js
* Copyright (c) 2013 Nicky Yan http://www.chinacoder.cn
* Date: 2013-11-16
* 使用anipadding可以方便实现动态效果。先提供的功能有划过位移,鼠标移上高亮显示.
*/
(
function(
$){
$.
fn.
extend({
yourname:
function(
options){
var
defaults = {
//参数 参数用逗号隔开
};
var
options =
$.
extend(
defaults ,
options);
//合并多个对象为一个
return
this.
each(
function(){
// var o = options ;
// var obj = $(this);
// var items = $("li a" , obj) ;
// code
});
}
});
})(
jQuery);