1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 程序名称: JavaScript 封装库 BETA 3.0 版 6 迭代版本: BETA 2.0 7 插件总数: 8 个 8 库方法数: 20 个 9 功能总数: 48 个 10 新增总数: 7 个 11 删除总数: 0 个 12 追加功能: 13 1. 新增“插件库”支持, 可*扩展网页特效插件 14 2. 新增“元素节点选择器”, 元素节点操纵简便性大大提升, 可读性加强 15 3. 新增“HTML DOM 加载”, 节省外部文件加载耗时 16 4. 库方法: 新增“CSS 处理”, 分离调用代码可读性加强 17 5. 库方法: 新增“class 处理”, 分离调用代码可读性加强 18 ... 19 优化功能: 20 1. 优化节点定位并删除了 name 方式定位, 遵循 W3C 原则 21 2. 优化节点事件绑定, 集中至“nodeEvent”方法同一调用, 可读性、扩展性、维护性大大加强 22 3. 库方法: 优化“清除空白节点”, 采用倒序遍历, 删除更加彻底简便 23 4. 库方法: 优化“清除注释节点”, 采用倒序遍历, 删除更加彻底简便 24 .... 25 删除功能: 26 无 27 */ 28 29 // 实例化基础库 30 $ = function () { 31 return arguments.length == 0 ? new Base() : new Base(arguments); 32 }; 33 34 // 基础库构造方法 35 var Base = function (nodes) { 36 this.info = ‘无节点‘; 37 this.elements = []; 38 if (typeof nodes == ‘object‘) { 39 var elements = [], node = null; 40 for (var i = 0; i < nodes.length; i ++) { 41 node = nodes[i]; 42 if (typeof node == ‘string‘) { // 元素节点选择器 43 // 全局或局部 44 if (this.elements.length == 0) this.elements.push(document); 45 var patternSpace = /[\s\t ]+/; 46 if (patternSpace.test(node)) { // 多层 47 node = node.split(patternSpace); 48 for (var j = 0; j < node.length; j ++) { 49 if (j == (node.length - 1)) { 50 elements.push(this.selector(node[j]).getNodes()); 51 } else { 52 this.selector(node[j]); 53 } 54 } 55 } else { // 单层 56 elements.push(this.selector(node).getNodes()); 57 } 58 this.elements = []; 59 } else if (typeof node == ‘object‘ && (node == window || typeof node.nodeType != ‘undefined‘)) { // 节点对象 60 this.elements.push(node); 61 } else if (typeof node == ‘function‘) { // HTML DOM 加载 62 this.htmlLoaded(node); 63 } 64 } 65 if (typeof elements != ‘undefined‘) { 66 for (var k = 0; k < elements.length; k ++) { 67 if (elements[k] instanceof Array) { // 集群 68 for (var l = 0; l < elements[k].length; l ++) { 69 if (elements[k][l] != this.info) this.elements.push(elements[k][l]); 70 } 71 } else { // 单一 72 if (elements[k] != this.info) this.elements.push(elements[k]); 73 } 74 } 75 } 76 } 77 }; 78 79 // 获取采集的所有节点 80 Base.prototype.getNodes = function () { 81 if (this.elements.length == 0) return this.info; 82 if (this.elements.length == 1) return this.firstNode(); 83 return this.elements; 84 }; 85 86 // 获取采集的首位节点 87 Base.prototype.firstNode = function () { 88 if (this.elements.length == 0) return this.info; 89 return this.elements[0]; 90 }; 91 92 // 获取采集的末尾节点 93 Base.prototype.lastNode = function () { 94 if (this.elements.length == 0) return this.info; 95 return this.elements[this.elements.length - 1]; 96 }; 97 98 // 获取 id 元素节点 99 Base.prototype.getId = function (ids, positioner) { 100 if (ids instanceof Array) { // 集群 101 for (var i = 0; i < ids.length; i ++) { 102 this.getId(ids[i], positioner); 103 } 104 } else { // 单一 105 var selector = null, node = null; 106 if (typeof positioner != ‘undefined‘) { // 局部 107 if (typeof positioner == ‘object‘ && typeof positioner.nodeType != ‘undefined‘) { 108 selector = positioner; 109 } else { 110 if (!(selector = Base.positioner(positioner))) return this; 111 } 112 } else { // 全局 113 selector = document; 114 } 115 if (selector instanceof Array) { // 集群 116 for (var j = 0; j < selector.length; j ++) { 117 node = selector[j].getElementsByTagName(‘*‘); 118 for (var k = 0; k < node.length; k ++) { 119 if (node[k].id == ids) { 120 for (var i = 0; i < this.elements.length; i ++) { 121 if (this.elements[i] == node[k]) return this; 122 } 123 this.elements.push(node[k]); 124 } 125 } 126 } 127 } else { // 单一 128 // 容错处理 129 if (typeof selector.getElementById != ‘undefined‘) { 130 node = selector.getElementById(ids); 131 if (node === null) return this; 132 for (var i = 0; i < this.elements.length; i ++) { 133 if (this.elements[i] == node) return this; 134 } 135 this.elements.push(node); 136 } else { 137 node = selector.getElementsByTagName(‘*‘); 138 for (var j = 0; j < node.length; j ++) { 139 if (node[j].id == ids) { 140 for (var i = 0; i < this.elements.length; i ++) { 141 if (this.elements[i] == node[j]) return this; 142 } 143 this.elements.push(node[j]); 144 } 145 } 146 } 147 } 148 } 149 return this; 150 }; 151 152 // 获取 tagName 元素节点 153 Base.prototype.getTagName = function (tagName, positioner) { 154 var selector = null, nodes = []; 155 if (typeof positioner != ‘undefined‘) { // 局部 156 if (typeof positioner == ‘object‘ && typeof positioner.nodeType != ‘undefined‘) { 157 selector = positioner; 158 } else { 159 if (!(selector = Base.positioner(positioner))) return this; 160 } 161 } else { // 全局 162 selector = document; 163 } 164 if (selector instanceof Array) { // 集群 165 for (var j = 0; j < selector.length; j ++) { 166 nodes = selector[j].getElementsByTagName(tagName); 167 for (var i = 0; i < nodes.length; i ++) { 168 this.elements.push(nodes[i]); 169 } 170 } 171 } else { // 单一 172 nodes = selector.getElementsByTagName(tagName); 173 for (var i = 0; i < nodes.length; i ++) { 174 this.elements.push(nodes[i]); 175 } 176 } 177 return this; 178 }; 179 180 // 获取 class 元素节点 181 Base.prototype.getClass = function (className, positioner) { 182 var selector = null, nodes = []; 183 if (typeof positioner != ‘undefined‘) { // 局部 184 if (typeof positioner == ‘object‘ && typeof positioner.nodeType != ‘undefined‘) { 185 selector = positioner; 186 } else { 187 if (!(selector = Base.positioner(positioner))) return this; 188 } 189 } else {// 全局 190 selector = document; 191 } 192 if (selector instanceof Array) { // 集群 193 for (var j = 0; j < selector.length; j ++) { 194 nodes = selector[j].getElementsByTagName(‘*‘); 195 for (var i = 0; i < nodes.length; i ++) { 196 if (Base.hasClass(className, nodes[i])) this.elements.push(nodes[i]); 197 } 198 } 199 } else { // 单一 200 nodes = selector.getElementsByTagName(‘*‘); 201 for (var i = 0; i < nodes.length; i ++) { 202 if (Base.hasClass(className, nodes[i])) this.elements.push(nodes[i]); 203 } 204 } 205 return this; 206 }; 207 208 // 获取 name 元素节点 209 Base.prototype.getName = function (name, positioner) { 210 var selector = null, nodes = []; 211 if (typeof positioner != ‘undefined‘) { // 局部 212 if (typeof positioner == ‘object‘ && typeof positioner.nodeType != ‘undefined‘) { 213 selector = positioner; 214 } else { 215 if (!(selector = Base.positioner(positioner))) return this; 216 } 217 } else { // 全局 218 selector = document; 219 } 220 if (selector instanceof Array) { // 集群 221 for (var j = 0; j < selector.length; j ++) { 222 nodes = selector[j].getElementsByTagName(‘*‘); 223 for (var i = 0; i < nodes.length; i ++) { 224 if (nodes[i].name == name) this.elements.push(nodes[i]); 225 } 226 } 227 } else { // 单一 228 // 容错处理 229 nodes = typeof selector.getElementsByName != ‘undefined‘ ? selector.getElementsByName(name) : selector.getElementsByTagName(‘*‘); 230 for (var i = 0; i < nodes.length; i ++) { 231 if (nodes[i].name == name) this.elements.push(nodes[i]); 232 } 233 } 234 return this; 235 }; 236 237 // 元素节点选择器 238 Base.prototype.selector = function (node) { 239 if (typeof node == ‘string‘) { 240 var nodes = [], elements = []; 241 var patternId = /([a-z]+)#([\w\-]+)/i; 242 var patternClass = /([a-z]+)\.([\w\-]+)/i; 243 var tagName = ‘‘, id = ‘‘, className = ‘‘; 244 for (var i = 0; i < this.elements.length; i ++) { 245 switch (node.charAt(0)) { 246 case ‘#‘ : // id 247 if ((nodes = $().getId(node.substring(1, node.length), this.elements[i]).getNodes()) != this.info) { 248 elements.push(nodes); 249 } 250 break; 251 case ‘.‘ : // class 252 if ((nodes = $().getClass(node.substring(1, node.length), this.elements[i]).getNodes()) != this.info) { 253 if (nodes instanceof Array) { // 集群 254 for (var j = 0; j < nodes.length; j ++) { 255 elements.push(nodes[j]); 256 } 257 } else { // 单一 258 elements.push(nodes); 259 } 260 } 261 break; 262 default : 263 if (patternId.test(node)) { // tagName + id 264 tagName = patternId.exec(node)[1]; 265 id = patternId.exec(node)[2]; 266 if ((nodes = $().getTagName(tagName, this.elements[i]).getNodes()) != this.info) { 267 if (nodes instanceof Array) { // 集群 268 for (var j = 0; j < nodes.length; j ++) { 269 if (nodes[j].id == id) elements.push(nodes[j]); 270 } 271 } else { // 单一 272 if (nodes.id == id) elements.push(nodes); 273 } 274 } 275 } else if (patternClass.test(node)) { // tagName + class 276 tagName = patternClass.exec(node)[1]; 277 className = patternClass.exec(node)[2]; 278 if ((nodes = $().getTagName(tagName, this.elements[i]).getNodes()) != this.info) { 279 if (nodes instanceof Array) { // 集群 280 for (var j = 0; j < nodes.length; j ++) { 281 if (Base.hasClass(className, nodes[j])) elements.push(nodes[j]); 282 } 283 } else { // 单一 284 if (Base.hasClass(className, nodes)) elements.push(nodes); 285 } 286 } 287 } else { // tagName 288 if ((nodes = $().getTagName(node, this.elements[i]).getNodes()) != this.info) { 289 if (nodes instanceof Array) { // 集群 290 for (var j = 0; j < nodes.length; j ++) { 291 elements.push(nodes[j]); 292 } 293 } else { // 单一 294 elements.push(nodes); 295 } 296 } 297 } 298 } 299 } 300 this.elements = elements; 301 } 302 return this; 303 }; 304 305 // 获取与设置元素内容 306 Base.prototype.html = function (text) { 307 var html = []; 308 for (var i = 0; i < this.elements.length; i ++) { 309 if (typeof text != ‘undefined‘) { // 设置 310 this.elements[i].innerHTML = text; 311 } else { // 获取 312 html.push(this.elements[i].innerHTML); 313 } 314 } 315 switch (html.length) { 316 case 0 : 317 return this; 318 break; 319 case 1 : 320 return html[0]; 321 break; 322 default : 323 return html; 324 } 325 }; 326 327 // 获取与设置表单元素内容 328 Base.prototype.value = function (text) { 329 var value = []; 330 for (var i = 0; i < this.elements.length; i ++) { 331 if (typeof text != ‘undefined‘) { // 设置 332 if (typeof this.elements[i].value != ‘undefined‘) this.elements[i].value = text; 333 } else { // 获取 334 if (typeof this.elements[i].value != ‘undefined‘) value.push(this.elements[i].value); 335 } 336 } 337 switch (value.length) { 338 case 0 : 339 return this; 340 break; 341 case 1 : 342 return value[0]; 343 break; 344 default : 345 return value; 346 } 347 }; 348 349 // 获取与设置 CSS 350 Base.prototype.css = function (cssKey, cssValue) { 351 if (typeof cssValue != ‘undefined‘ || cssKey instanceof Array) { // 设置 352 if (cssKey instanceof Array) { // 集群 353 var patternStyle = /^([a-z]+)[\s\t ]*=[\s\t ]*([\w\(=,\s\.#\/\\\‘\"\-\)]+)$/i; 354 var key = ‘‘, value = ‘‘; 355 for (var i = 0; i < cssKey.length; i ++) { 356 if (patternStyle.test(cssKey[i])) { 357 key = patternStyle.exec(cssKey[i])[1]; 358 value = patternStyle.exec(cssKey[i])[2]; 359 this.css(key, value); 360 } 361 } 362 } else { // 单一 363 for (var i = 0; i < this.elements.length; i ++) { 364 if (typeof this.elements[i].style[cssKey] != ‘undefined‘) { 365 this.elements[i].style[cssKey] = cssValue; 366 } 367 } 368 } 369 } else { // 获取 370 var css = [], style = ‘‘; 371 for (var i = 0; i < this.elements.length; i ++) { 372 if (typeof (style = Tool.getStyle(cssKey, this.elements[i])) != ‘undefined‘) css.push(style); 373 } 374 switch (css.length) { 375 case 0 : 376 return this; 377 break; 378 case 1 : 379 return css[0]; 380 break; 381 default : 382 return css; 383 break; 384 } 385 } 386 return this; 387 }; 388 389 // 添加 class 选择器 390 Base.prototype.addClass = function (className) { 391 if (className instanceof Array) { // 集群 392 for (var i = 0; i < className.length; i ++) { 393 this.addClass(className[i]); 394 } 395 } else { // 单一 396 var space = ‘‘; 397 for (var i = 0; i < this.elements.length; i ++) { 398 space = this.elements[i].className != ‘‘ ? ‘ ‘ : space; 399 if (!Base.hasClass(className, this.elements[i])) this.elements[i].className += space + className; 400 } 401 } 402 return this; 403 }; 404 405 // 移除 class 选择器 406 Base.prototype.removeClass = function (className) { 407 if (className instanceof Array) { // 集群 408 for (var i = 0; i < className.length; i ++) { 409 this.removeClass(className[i]); 410 } 411 } else { // 单一 412 var node = null; 413 for (var i = 0; i < this.elements.length; i ++) { 414 node = this.elements[i]; 415 if (Base.hasClass(className, node)) { 416 node.className = node.className.replace(new RegExp(‘(^|\\s+)‘ + className + ‘(\\s+|$)‘), ‘ ‘); 417 node.className = Base.trim(node.className); 418 } 419 } 420 } 421 return this; 422 }; 423 424 // 添加样式规则 425 Base.prototype.addRule = function (ruleName, ruleText, rulePosition, sheetIndex) { 426 if (ruleName instanceof Array) { // 集群 427 if (!(ruleText instanceof Array) || ruleName.length != ruleText.length) return this; 428 for (var i = 0; i < ruleName.length; i ++) { 429 if (ruleName[i] && ruleText[i]) this.addRule(ruleName[i], ruleText[i], rulePosition, sheetIndex); 430 } 431 } else { // 单一 432 var rule = Base.checkRule(rulePosition, sheetIndex); 433 if (typeof rule.sheet != ‘undefined‘) { 434 var nameTotal = Tool.ruleNameTotal(rule.sheet); 435 for (var i = 0; i < nameTotal.length; i ++) { 436 if (nameTotal[i] == ruleName) return this; 437 } 438 Tool.addRule(rule.sheet, ruleName, ruleText, rule.position); 439 } 440 } 441 return this; 442 }; 443 444 // 移除样式规则 445 Base.prototype.removeRule = function (rulePosition, ruleNumber, sheetIndex) { 446 var rule = Base.checkRule(rulePosition, sheetIndex, ruleNumber); 447 if (typeof rule.sheet != ‘undefined‘) { 448 for (var i = 0; i < rule.number; i ++) { 449 Tool.removeRule(rule.sheet, rule.position); 450 } 451 } 452 return this; 453 }; 454 455 // 节点事件绑定 456 Base.prototype.nodeEvent = function (eventName, method, mode) { 457 if (typeof eventName != ‘string‘ || typeof method != ‘function‘) return this; 458 eventName = eventName.toLowerCase(); 459 if (eventName.indexOf(‘on‘) == 0) eventName = eventName.substring(2, eventName.length); 460 if (typeof mode == ‘undefined‘) mode = true; 461 for (var i = 0; i < this.elements.length; i ++) { 462 switch (eventName) { 463 case ‘mousewheel‘ : 464 Tool.mousewheel(this.elements[i], method, mode); 465 break; 466 default : 467 mode ? Tool.loginEvent(this.elements[i], eventName, method) : Tool.logoutEvent(this.elements[i], eventName, method); 468 } 469 } 470 return this; 471 }; 472 473 // HTML DOM 加载 474 Base.prototype.htmlLoaded = function (method) { 475 if (typeof method == ‘function‘) Tool.htmlLoaded(method); 476 return this; 477 }; 478 479 // 加载特效插件 480 Base.prototype.plugins = function (pluginName, pluginMethod) { 481 if (pluginName instanceof Array) { // 集群 482 if (!(pluginMethod instanceof Array) || pluginName.length != pluginMethod.length) return false; 483 for (var i = 0; i < pluginName.length; i ++) { 484 this.plugins(pluginName[i], pluginMethod[i]); 485 } 486 } else { // 单一 487 if (typeof pluginName == ‘string‘ && typeof pluginMethod == ‘function‘) { 488 Base.prototype[pluginName] = pluginMethod; 489 } 490 } 491 return this; 492 }; 493 494 /* 495 库方法集合 496 */ 497 // 库方法: 清除两边空格 498 Base.trim = function (string) { 499 if (typeof string != ‘string‘) return string; 500 var patternLeft = /^[\s\t ]+/; 501 var patternRight = /[\s\t ]+$/; 502 if (patternLeft.test(string)) string = string.replace(patternLeft, ‘‘); 503 if (patternRight.test(string)) string = string.replace(patternRight, ‘‘); 504 return string; 505 }; 506 507 // 库方法: 检测样式规则 508 Base.checkRule = function (rulePosition, sheetIndex, ruleNumber) { 509 if (typeof rulePosition != ‘number‘) rulePosition = 0; 510 if (typeof sheetIndex != ‘number‘) sheetIndex = 0; 511 if (typeof ruleNumber != ‘number‘) ruleNumber = 1; 512 var sheetObject = undefined; 513 var sheetTotal = document.styleSheets.length; 514 if (sheetTotal != 0 && sheetIndex <= (sheetTotal - 1)) { // 兼容 IE 6/7/8 防止 unknown 515 sheetObject = document.styleSheets[sheetIndex]; 516 } 517 if (typeof sheetObject != ‘undefined‘) { 518 var ruleTotal = Tool.ruleTotal(sheetObject); 519 if (rulePosition > ruleTotal) rulePosition = ruleTotal; 520 var maxNumber = ruleTotal - rulePosition; 521 if (ruleNumber > maxNumber) ruleNumber -= ruleNumber - maxNumber; 522 } 523 return { 524 position : rulePosition, 525 sheet : sheetObject, 526 number : ruleNumber 527 } 528 }; 529 530 // 库方法: 检测 class 531 Base.hasClass = function (className, elementNode) { 532 return (new RegExp(‘(^|\\s+)‘ + className + ‘(\\s+|$)‘)).test(elementNode.className); 533 } 534 535 // 库方法: 元素节点定位器(局部搜索) 536 Base.positioner = function (positioner) { 537 if (typeof positioner != ‘string‘) return false; 538 var nodes = []; 539 var patternId = /^id\s*=\s*([\w\-]+)$/i; 540 var patternTag = /^tag(Name)?\s*=\s*([a-z]+)$/i; 541 var patternClass = /^class(Name)?\s*=\s*([\w\-]+)$/i; 542 if (patternTag.test(positioner)) { // tagName 543 positioner = patternTag.exec(positioner)[2]; 544 nodes = $().getTagName(positioner).getNodes(); 545 } else if (patternClass.test(positioner)) { // class 546 positioner = patternClass.exec(positioner)[2]; 547 nodes = $().getClass(positioner).getNodes(); 548 } else if (patternId.test(positioner)) { // id 549 positioner = patternId.exec(positioner)[1]; 550 nodes = $().getId(positioner).getNodes(); 551 } else { // id 552 nodes = $().getId(positioner).getNodes(); 553 } 554 if (nodes == $().info) return false; 555 return nodes; 556 }; 557 558 // 库方法: 获取元素从属关系(直接从属) 559 Base.hasChild = function (elementNode, targetNode) { 560 var childs = targetNode.childNodes; 561 for (var i = 0; i < childs.length; i ++) { 562 if (childs[i].nodeType == 1 && childs[i] == elementNode) return true; 563 } 564 return false; 565 }; 566 567 // 库方法: 清除空白节点 568 Base.clear = function (elementNode) { 569 var childs = elementNode.childNodes; 570 var length = childs.length; 571 for (var i = (length - 1); i >= 0; i --) { 572 if (childs[i].nodeType == 3 && /^[\s\t ]+$/.test(childs[i].nodeValue)) elementNode.removeChild(childs[i]); 573 } 574 return elementNode; 575 }; 576 577 // 库方法: 清除注释节点 578 Base.comment = function (elementNode) { 579 var childs = elementNode.childNodes; 580 var length = childs.length; 581 for (var i = (length - 1); i >= 0; i --) { 582 if (childs[i].nodeType == 8) { 583 elementNode.removeChild(childs[i]); 584 } 585 } 586 return elementNode; 587 }; 588 589 // 库方法: 字符串删减 590 Base.replace = function (string, index) { 591 if (typeof string != ‘string‘) return string; 592 if (string.indexOf(index) != -1) string = string.replace(new RegExp(index, ‘ig‘), ‘‘); 593 return string; 594 }; 595 596 // 库方法: 添加元素节点 597 Base.addElement = function (elementName, attributes, html, targetNode) { 598 var elementNode = document.createElement(elementName); 599 if (typeof attributes == ‘string‘ || attributes instanceof Array) this.addAttribute(attributes, elementNode); 600 if (typeof html != ‘undefined‘) $(elementNode).html(html); 601 if (typeof targetNode != ‘undefined‘) { 602 if (!(typeof targetNode == ‘object‘ || targetNode.nodeType == 1)) { 603 if (!(targetNode = this.positioner(targetNode))) targetNode = document.body; 604 } 605 } else { 606 targetNode = document.body; 607 } 608 if (targetNode instanceof Array) { // 集群 609 for (var i = 0; i < targetNode.length; i ++) { 610 targetNode[i].appendChild(elementNode.cloneNode(true)); 611 } 612 } else { // 单一 613 targetNode.appendChild(elementNode); 614 } 615 return elementNode; 616 }; 617 618 // 库方法: 添加属性节点 619 Base.addAttribute = function (attributes, elementNode) { 620 if (attributes instanceof Array) { // 集群 621 for (var i = 0; i < attributes.length; i ++) { 622 this.addAttribute(attributes[i], elementNode); 623 } 624 } else { // 单一 625 if (typeof attributes != ‘string‘) return false; 626 var patternAttribute = /^([a-z]+)[\s\t ]*=[\s\t ]*([\w,\(#=:\s\.\/\\\‘\";\-\)]+)$/i; 627 var key = ‘‘, value = ‘‘; 628 if (patternAttribute.test(attributes)) { 629 key = patternAttribute.exec(attributes)[1]; 630 value = patternAttribute.exec(attributes)[2]; 631 var patternClass = /^class(Name)?$/i, className = []; 632 if (key == ‘style‘) { // CSS 633 this.style(value, elementNode); 634 } else if (patternClass.test(key)) { // class 635 this.addClass(value, elementNode); 636 } else { 637 elementNode.setAttribute(key, value); 638 } 639 } 640 } 641 }; 642 643 // 库方法: CSS 处理 644 Base.style = function (css, elementNode) { 645 var split = /;[\s\t ]*/i; 646 if (split.test(css)) { // 集群 647 css = css.split(split); 648 for (var i = 0; i < css.length; i ++) { 649 this.style(css[i], elementNode); 650 } 651 } else { // 单一 652 var patternCSS = /^([a-z]+)[\s\t ]*:[\s\t ]*([\w\(=\s\.,\/\\\‘#\"\-\)]+)$/i, cssKey = ‘‘, cssValue = ‘‘; 653 if (patternCSS.test(css)) { 654 cssKey = patternCSS.exec(css)[1]; 655 cssValue = patternCSS.exec(css)[2]; 656 $(elementNode).css(cssKey, cssValue); 657 } 658 } 659 }; 660 661 // 库方法: class 处理 662 Base.addClass = function (className, elementNode) { 663 var split = /[\s\t ]+/; 664 if (split.test(className)) { 665 className = className.split(split); 666 for (var i = 0; i < className.length; i ++) { 667 this.addClass(className[i], elementNode); 668 } 669 } else { 670 $(elementNode).addClass(className); 671 } 672 }; 673 674 // 库方法: 移除元素节点 675 Base.removeElement = function (elementNode, targetNode) { 676 if (!(typeof elementNode == ‘object‘ || elementNode.nodeType == 1)) { 677 if (!(elementNode = this.positioner(elementNode))) return false; 678 } 679 if (typeof targetNode == ‘undefined‘ || !(typeof targetNode == ‘object‘ || targetNode.nodeType == 1)) { 680 if (!(targetNode = this.positioner(targetNode))) targetNode = document.body; 681 } 682 if (targetNode instanceof Array) { // 集群 683 for (var i = 0; i < targetNode.length; i ++) { 684 this.removeElement(elementNode, targetNode[i]); 685 } 686 } else { // 单一 687 if (elementNode instanceof Array) { // 集群 688 for (var i = 0; i < elementNode.length; i ++) { 689 this.removeElement(elementNode[i], targetNode); 690 } 691 } else { // 单一 692 if (this.hasChild(elementNode, targetNode)) targetNode.removeChild(elementNode); 693 } 694 } 695 }; 696 697 // 库方法: 初始化滚动条 698 Base.initializationScroll = function () { 699 Tool.scrollLeft(0); 700 Tool.scrollTop(0); 701 }; 702 703 // 库方法: 设置与获取滚动条 704 Base.scroll = function (x, y) { 705 if (typeof x != ‘number‘ && typeof y != ‘number‘) { // 获取 706 return { 707 x : Tool.scrollLeft(), 708 y : Tool.scrollTop() 709 } 710 } 711 if (typeof x == ‘number‘) { // 设置x轴 712 Tool.scrollLeft(x); 713 } 714 if (typeof y == ‘number‘) { // 设置y轴 715 Tool.scrollTop(y); 716 } 717 }; 718 719 // 库方法: 获取网页可视区尺寸 720 Base.getWindowRectangle = function () { 721 return { 722 width : Tool.getWindowWidth(), 723 height : Tool.getWindowHeight() 724 } 725 }; 726 727 // 库方法: 获取元素尺寸 728 Base.getInnerRectangle = function (elementNode) { 729 var width = 0, height = 0, display = ‘‘, _this = null; 730 _this = $(elementNode); 731 display = _this.css(‘display‘); 732 width = _this.css(‘width‘); 733 height = _this.css(‘height‘); 734 if (width == ‘auto‘ || height == ‘auto‘) { // IE 6/7/8 735 if (display == ‘none‘) _this.show(); 736 width = elementNode.offsetWidth; 737 height = elementNode.offsetHeight; 738 } 739 width = this.replace(width, ‘px‘); 740 height = this.replace(height, ‘px‘); 741 return { 742 width : width, 743 height : height 744 }; 745 }; 746 747 // 库方法: 获取元素外边距尺寸 748 Base.getOuterRectangle = function (elementNode) { 749 this.absolute(elementNode); 750 var left = 0, top = 0, display = ‘‘, _this = null; 751 _this = $(elementNode); 752 display = _this.css(‘display‘); 753 left = _this.css(‘left‘); 754 top = _this.css(‘top‘); 755 if (left == ‘auto‘ || top == ‘auto‘) { // IE 6/7/8 756 if (display == ‘none‘) _this.show(); 757 left = elementNode.offsetLeft; 758 top = elementNode.offsetTop; 759 } 760 left = this.replace(left, ‘px‘); 761 top = this.replace(top, ‘px‘); 762 return { 763 left : left, 764 top : top 765 }; 766 }; 767 768 // 库方法: 设置元素绝对定位 769 Base.absolute = function (elementNode) { 770 var _this = $(elementNode); 771 if (_this.css(‘position‘) != ‘absolute‘) _this.css([‘position = absolute‘, ‘left = 0‘, ‘top = 0‘]); 772 }; 773 774 // 库方法: 固定锁屏区域(修正浏览器Bug) 775 Base.fixed = function () { 776 // IE Bug 修正 777 var down = function () { 778 var move = function (event) { 779 event.preventDefault(); 780 }; 781 var up = function () { 782 $(‘#screen‘).nodeEvent(‘mousemove‘, move, false); 783 $(‘#screen‘).nodeEvent(‘mouseup‘, up, false); 784 }; 785 $(‘#screen‘).nodeEvent(‘mousemove‘, move); 786 $(‘#screen‘).nodeEvent(‘mouseup‘, up); 787 }; 788 $(‘#screen‘).nodeEvent(‘mousedown‘, down); 789 // Chrome Bug 修改 790 $(‘#screen‘).nodeEvent(‘mousewheel‘, function (event) { 791 event.preventDefault(); 792 }); 793 };
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 程序名称: JavaScript 工具库(跨浏览器兼容) BETA 3.0 版 6 迭代版本: BETA 2.0 7 功能总数: 18 个 8 新增总数: 2 个 9 删除总数: 0 个 10 追加功能: 11 1. 新增“跨浏览器获取样式规则名称集合” 12 2. 新增“跨浏览器 HTML DOM 加载” 13 优化功能: 14 1. 优化跨浏览器滚动条设置与获取至“scrollLeft”和“scrollTop”方法中 15 删除功能: 16 无 17 */ 18 19 // 工具库 20 var Tool = { 21 // 数组排序 22 sort : { 23 minToMax : function (min, max) { 24 if (min < max) { 25 return -1; 26 } else if (min > max) { 27 return 1; 28 } else { 29 return 0; 30 } 31 }, 32 maxToMin : function (min, max) { 33 if (min < max) { 34 return 1; 35 } else if (min > max) { 36 return -1; 37 } else { 38 return 0; 39 } 40 } 41 }, 42 43 // 跨浏览器获取计算后的样式 44 getStyle : function (cssKey, elementNode) { 45 if (typeof window.getComputedStyle != ‘undefined‘) { // W3C 46 return window.getComputedStyle(elementNode, null)[cssKey]; 47 } else if (typeof elementNode.currentStyle != ‘undefined‘) { // IE 6/7/8 48 return elementNode.currentStyle[cssKey]; 49 } 50 }, 51 52 // 跨浏览器获取样式规则总数 53 ruleTotal : function (sheetObject) { 54 if (typeof sheetObject.cssRules != ‘undefined‘) { // W3C 55 return sheetObject.cssRules.length; 56 } else if (typeof sheetObject.rules != ‘undefined‘) { // IE 6/7/8 57 return sheetObject.rules.length; 58 } 59 }, 60 61 // 跨浏览器获取样式规则名称集合 62 ruleNameTotal : function (sheetObject) { 63 var nameTotal = []; 64 if (typeof sheetObject.cssRules != ‘undefined‘) { // W3C 65 for (var i = 0; i < sheetObject.cssRules.length; i ++) { 66 nameTotal.push(sheetObject.cssRules[i].selectorText); 67 } 68 } else if (typeof sheetObject.rules != ‘undefined‘) { // IE 6/7/8 69 for (var i = 0; i < sheetObject.rules.length; i ++) { 70 nameTotal.push(sheetObject.rules[i].selectorText); 71 } 72 } 73 return nameTotal; 74 }, 75 76 // 跨浏览器添加样式规则 77 addRule : function (sheetObject, ruleName, ruleText, rulePosition) { 78 if (typeof sheetObject.insertRule != ‘undefined‘) { // W3C 79 sheetObject.insertRule(ruleName + ‘ {‘ + ruleText + ‘}‘, rulePosition); 80 } else if (typeof sheetObject.addRule != ‘undefined‘) { // IE 6/7/8 81 sheetObject.addRule(ruleName, ruleText, rulePosition); 82 } 83 }, 84 85 // 跨浏览器移除样式规则 86 removeRule : function (sheetObject, rulePosition) { 87 if (typeof sheetObject.deleteRule != ‘undefined‘) { // W3C 88 sheetObject.deleteRule(rulePosition); 89 } else if (typeof sheetObject.removeRule != ‘undefined‘) { // IE 6/7/8 90 sheetObject.removeRule(rulePosition); 91 } 92 }, 93 94 // IE 6/7/8 事件对象匹配模式 95 eventMatch : function (event) { 96 event.target = event.srcElement; 97 event.stopPropagation = function () { 98 event.cancelBubble = true; 99 }; 100 event.preventDefault = function () { 101 event.returnValue = false; 102 }; 103 return event; 104 }, 105 106 // 事件绑定唯一标识符 107 eventId : 0, 108 109 // 跨浏览器现代事件绑定: 注册事件 110 loginEvent : function (elementNode, eventName, method) { 111 if (typeof elementNode.addEventListener != ‘undefined‘) { // W3C 112 elementNode.addEventListener(eventName, method, false); 113 } else if (typeof elementNode.attachEvent != ‘undefined‘) { // IE 6/7/8 114 if (typeof elementNode.hashTable != ‘object‘) elementNode.hashTable = {}; 115 if (typeof elementNode.hashTable[eventName] != ‘object‘) elementNode.hashTable[eventName] = []; 116 var events = elementNode.hashTable[eventName]; 117 for (var i = 0; i < events.length; i ++) { 118 if (events[i] == method) return false; 119 } 120 events[this.eventId ++] = method; 121 var _this = this; 122 elementNode[‘on‘ + eventName] = function () { 123 var event = _this.eventMatch(window.event); 124 for (var i = 0; i < events.length; i ++) { 125 if (typeof events[i] == ‘function‘) events[i].call(this, event); 126 } 127 }; 128 } 129 }, 130 131 // 跨浏览器现代事件绑定: 注销事件 132 logoutEvent : function (elementNode, eventName, method) { 133 if (typeof elementNode.removeEventListener != ‘undefined‘) { // W3C 134 elementNode.removeEventListener(eventName, method, false); 135 } else if (typeof elementNode.detachEvent != ‘undefined‘) { // IE 6/7/8 136 if (typeof elementNode.hashTable == ‘object‘ && typeof elementNode.hashTable[eventName] == ‘object‘) { 137 var events = elementNode.hashTable[eventName]; 138 for (var i = 0; i < events.length; i ++) { 139 if (events[i] == method) delete events[i]; 140 } 141 } 142 } 143 }, 144 145 // 跨浏览器鼠标滚轮事件 146 mousewheel : function (elementNode, method, mode) { 147 if (elementNode == window) elementNode = document; // IE 6/7/8 148 if (typeof elementNode.onmousewheel != ‘undefined‘) { // Not Firefox 149 mode ? this.loginEvent(elementNode, ‘mousewheel‘, method) : this.logoutEvent(elementNode, ‘mousewheel‘, method); 150 } else { // Firefox 151 mode ? this.loginEvent(elementNode, ‘DOMMouseScroll‘, method) : this.logoutEvent(elementNode, ‘DOMMouseScroll‘, method); 152 } 153 }, 154 155 // 跨浏览器 HTML DOM 加载 156 htmlLoaded : function (method) { 157 if ((browserDetect.opera && browserDetect.browser.version < 9) 158 || 159 (browserDetect.firefox && browserDetect.browser.version < 3) 160 || 161 (browserDetect.engine.name == ‘WebKit‘ && browserDetect.engine.version < 525)) { // low version W3C 162 var timer = setTimeout(function () { 163 clearTimeout(timer); 164 /interactive|loading|complete/i.test(document.readyState) ? method() : timer = setTimeout(arguments.callee, 1); 165 }, 1); 166 } else if (!browserDetect.ie || browserDetect.browser.version > 8) { // current W3C 167 var _this = this; 168 this.loginEvent(document, ‘DOMContentLoaded‘, function () { 169 _this.logoutEvent(document, ‘DOMContentLoaded‘, arguments.callee); 170 method(); 171 }); 172 } else if (browserDetect.ie && browserDetect.browser.version < 9) { // IE 6/7/8 173 var timer = setTimeout(function () { 174 try { 175 clearTimeout(timer); 176 document.documentElement.doScroll(‘top‘); 177 method(); 178 } catch (error) { 179 timer = setTimeout(arguments.callee, 1); 180 } 181 }, 1); 182 } 183 }, 184 185 // 跨浏览器获取元素从属关系(间接从属+直接从属) 186 getContains : function (elementNode, targetNode) { 187 if (typeof targetNode.compareDocumentPosition != ‘undefined‘) { // W3C 188 return targetNode.compareDocumentPosition(elementNode) == 20; 189 } else if (typeof targetNode.contains != ‘undefined‘) { // IE 6/7/8 190 return targetNode.contains(elementNode); 191 } 192 }, 193 194 // 跨浏览器获取与设置滚动条x轴 195 scrollLeft : function (x) { 196 if (browserDetect.engine.name == ‘WebKit‘) { // Chrome / Safari 197 if (typeof x != ‘undefined‘) { // 设置 198 document.body.scrollLeft = x; 199 } else { // 获取 200 return document.body.scrollLeft; 201 } 202 } else { // Not Chrome / Safari 203 if (typeof x != ‘undefined‘) { // 设置 204 document.documentElement.scrollLeft = x; 205 } else { // 获取 206 return document.documentElement.scrollLeft; 207 } 208 } 209 }, 210 211 // 跨浏览器获取与控制滚动条y轴 212 scrollTop : function (y) { 213 if (browserDetect.engine.name == ‘WebKit‘) { // Chrome / Safari 214 if (typeof y != ‘undefined‘) { // 设置 215 document.body.scrollTop = y; 216 } else { // 获取 217 return document.body.scrollTop; 218 } 219 } else { // Not Chrome / Safari 220 if (typeof y != ‘undefined‘) { // 设置 221 document.documentElement.scrollTop = y; 222 } else { // 获取 223 return document.documentElement.scrollTop; 224 } 225 } 226 }, 227 228 // 跨浏览器获取网页x轴可视区域尺寸 229 getWindowWidth : function () { 230 if (typeof window.innerWidth != ‘undefined‘) { // W3C 231 return window.innerWidth; 232 } else if (typeof document.documentElement.clientWidth != ‘undefined‘) { // IE 6/7/8 233 return document.documentElement.clientWidth; 234 } 235 }, 236 237 // 跨浏览器获取网页y轴可视区域尺寸 238 getWindowHeight : function () { 239 if (typeof window.innerHeight != ‘undefined‘) { // W3C 240 return window.innerHeight; 241 } else if (typeof document.documentElement.clientHeight) { // IE 6/7/8 242 return document.documentElement.clientHeight; 243 } 244 }, 245 246 // IE 专属: 浏览器外捕获鼠标按下 247 setCaptureIE : function (elementNode) { 248 if (typeof elementNode.setCapture != ‘undefined‘) { // IE 249 elementNode.setCapture(); 250 } 251 }, 252 253 // IE 专属: 浏览器外捕获鼠标弹起 254 releaseCaptureIE : function (elementNode) { 255 if (typeof elementNode.releaseCapture != ‘undefined‘) { // IE 256 elementNode.releaseCapture(); 257 } 258 } 259 260 };
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 程序名称: 浏览器嗅探器 BETA 3.0 6 版本迭代: 无 7 功能总数: 4 个 8 功能介绍: 9 1. 支持浏览器品牌嗅探 10 2. 支持浏览器名称/版本嗅探 11 3. 支持浏览器引擎名称/版本嗅探 12 4. 支持浏览器隶属平台名称/版本嗅探 13 */ 14 (function () { 15 window.browserDetect = { 16 ie : false, 17 firefox : false, 18 chrome : false, 19 safari : false, 20 opera : false, 21 other : false, 22 23 browser : { 24 name : ‘‘, 25 version : ‘‘ 26 }, 27 engine : { 28 name : ‘‘, 29 version : ‘‘ 30 }, 31 system : { 32 name : ‘‘, 33 version : ‘‘ 34 } 35 }; 36 37 var info = navigator.userAgent; 38 var system = navigator.platform; 39 40 /* 41 Browser pattern 42 */ 43 // check IE 44 var patternIE = /MSIE\s([\d\.]+)/i; 45 var patternHighIE = /rv:([\d\.]+)/i; 46 // check Firefox 47 var patternFirefox = /Firefox\/([\d\.]+)/i; 48 // check Chrome 49 var patternChrome = /Chrome\/([\d\.]+)/i; 50 // check Safari 51 var patternSafari = /Safari\/([\d\.]+)/i; 52 // check Opera 53 var patternOpera = /Opera\/([\d\.]+)/i; 54 55 /* 56 Engine pattern 57 */ 58 // check Trident 59 var patternTrident = /Trident\/([\d\.]+)/i; 60 // check Gecko 61 var patternGecko = /Gecko\/(\d+)/i; 62 // check WebKit 63 var patternWebKit = /AppleWebKit\/([\d\.]+)/i; 64 // check Presto 65 var patternPresto = /Presto\/([\d\.]+)/i; 66 67 /* 68 System pattern 69 */ 70 // check Windows 71 var patternWindows = /Windows\sNT\s([\d\.]+)/i; 72 var patternWin = /Win/i; 73 // check Linux 74 var patternLinux = /Linux/i; 75 // check Unix 76 var patternUnix = /X11/i; 77 // check Mac 78 var patternMac = /Mac/i; 79 80 /* 81 Check browser 82 */ 83 if ((low = patternIE.test(info)) || (high = patternTrident.test(info))) { // IE 84 browserDetect.ie = true; 85 browserDetect.browser.name = ‘Internet Explorer‘; 86 browserDetect.engine.name = ‘Trident‘; 87 if (low) { // IE 6 - 10 88 browserDetect.browser.version = parseFloat(patternIE.exec(info)[1]); 89 } else if (high) { // IE 11+ 90 browserDetect.browser.version = parseFloat(patternHighIE.exec(info)[1]); 91 } 92 if (browserDetect.browser.version >= 6.0) { 93 switch (browserDetect.browser.version) { // engine version 94 case 6.0 : 95 browserDetect.engine.version = 2.0; 96 break; 97 case 7.0 : 98 browserDetect.engine.version = 3.0; 99 break; 100 default : 101 browserDetect.engine.version = parseFloat(patternTrident.exec(info)[1]); 102 } 103 } else { 104 browserDetect.engine.version = ‘2.0-‘; 105 } 106 } else if (patternFirefox.test(info)) { // Firefox 107 browserDetect.firefox = true; 108 browserDetect.browser.name = ‘Firefox‘; 109 browserDetect.browser.version = parseFloat(patternFirefox.exec(info)[1]); 110 } else if (patternChrome.test(info)) { // Chrome 111 browserDetect.chrome = true; 112 browserDetect.browser.name = ‘Chrome‘; 113 browserDetect.browser.version = parseFloat(patternChrome.exec(info)[1]); 114 } else if (patternSafari.test(info)) { // Safari 115 browserDetect.safari = true; 116 browserDetect.browser.name = ‘Safari‘; 117 var patternVersion = /Version\/([\d\.]+)/i; 118 if (patternVersion.test(info)) { // high version 119 browserDetect.browser.version = parseFloat(patternVersion.exec(info)[1]); 120 } else { // low version 121 browserDetect.browser.version = parseFloat(patternSafari.exec(info)[1]); 122 } 123 } else if (patternOpera.test(info)) { // Opera 124 browserDetect.opera = true; 125 browserDetect.browser.name = ‘Opera‘; 126 var patternVersion = /Version\/([\d\.]+)/i; 127 if (patternVersion.test(info)) { // high version 128 browserDetect.browser.version = parseFloat(patternVersion.exec(info)[1]); 129 } else { // low version 130 browserDetect.browser.version = parseFloat(patternOpera.exec(info)[1]); 131 } 132 } else { // Other 133 browserDetect.other = true; 134 browserDetect.browser.name = ‘Other‘; 135 browserDetect.browser.version = ‘Unknown‘; 136 } 137 138 /* 139 Check Engine 140 */ 141 if (patternTrident.test(info)) { // Trident 142 browserDetect.engine.name = ‘Trident‘; 143 browserDetect.engine.version = parseFloat(patternTrident.exec(info)[1]); 144 } else if (patternGecko.test(info)) { // Gecko 145 browserDetect.engine.name = ‘Gecko‘; 146 var patternVersion = /rv:([\d\.]+)/i; 147 if (patternVersion.test(info)) { // high version 148 browserDetect.engine.version = parseFloat(patternVersion.exec(info)[1]); 149 } else { // low version 150 browserDetect.engine.version = parseFloat(patternGecko.exec(info)[1]); 151 } 152 } else if (patternWebKit.test(info)) { // WebKit 153 browserDetect.engine.name = ‘WebKit‘; 154 browserDetect.engine.version = parseFloat(patternWebKit.exec(info)[1]); 155 } else if (patternPresto.test(info)) { // Presto 156 browserDetect.engine.name = ‘Presto‘; 157 browserDetect.engine.version = parseFloat(patternPresto.exec(info)[1]); 158 } else { // Other 159 if (browserDetect.other) { 160 browserDetect.engine.name = ‘Other‘; 161 browserDetect.engine.version = ‘Unknown‘; 162 } 163 } 164 165 /* 166 Check System 167 */ 168 if (patternWindows.test(info)) { // Windows 169 browserDetect.system.version = parseFloat(patternWindows.exec(info)[1]); 170 switch (browserDetect.system.version) { 171 case 5.0 : 172 browserDetect.system.name = ‘Windows 2000‘; 173 break; 174 case 5.1 : 175 browserDetect.system.name = ‘Windows XP‘; 176 break; 177 case 5.2 : 178 browserDetect.system.name = ‘Windows Server 2003 / Windows Server 2003 R2‘; 179 break; 180 case 6.0 : 181 browserDetect.system.name = ‘Windows Vista / Windows Server 2008‘; 182 break; 183 case 6.1 : 184 browserDetect.system.name = ‘Windows 7 / Windows Server 2008 R2‘; 185 break; 186 case 6.2 : 187 browserDetect.system.name = ‘Windows 8 / Windows Server 2012 / Windows Phone 8‘; 188 break 189 case 6.3 : 190 browserDetect.system.name = ‘Windows 8.1 / Windows Server 2012 R2‘; 191 break; 192 default : 193 browserDetect.system.name = ‘Windows‘; 194 } 195 } else if (patternWin.test(system)) { // Windows(low version browser) 196 browserDetect.system.name = ‘Windows‘; 197 browserDetect.system.version = ‘Unknown‘; 198 } else if (patternLinux.test(system)) { // Linux 199 browserDetect.system.name = ‘Linux‘; 200 browserDetect.system.version = ‘Unknown‘; 201 } else if (patternUnix.test(system)) { // Unix 202 browserDetect.system.name = ‘Unix‘; 203 browserDetect.system.version = ‘Unknown‘; 204 } else if (patternMac.test(system)) { // Mac 205 browserDetect.system.name = ‘Mac‘; 206 browserDetect.system.version = ‘Unknown‘; 207 } else { // Other 208 browserDetect.system.name = ‘Other‘; 209 browserDetect.system.version = ‘Unknown‘; 210 } 211 212 })();
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 特效插件: 元素隐藏 6 特效插件: 元素显示 7 特效插件: 鼠标移入移出(下拉菜单) 8 */ 9 $().plugins([‘hide‘, ‘show‘, ‘hover‘], [function () { 10 this.css(‘display‘, ‘none‘); 11 return this; 12 }, function () { 13 this.css(‘display‘, ‘block‘); 14 return this; 15 }, function (overMethod, outMethod) { 16 this.nodeEvent(‘mouseover‘, overMethod); 17 this.nodeEvent(‘mouseout‘, outMethod); 18 return this; 19 }]);
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 特效插件: 元素居中 6 */ 7 $().plugins(‘center‘, function () { 8 var windowRectangle = Base.getWindowRectangle(); 9 var scroll = Base.scroll(); 10 var innerRectangle = null, x = 0, y = 0; 11 for (var i = 0; i < this.elements.length; i ++) { 12 Base.absolute(this.elements[i]); 13 innerRectangle = Base.getInnerRectangle(this.elements[i]); 14 x = (windowRectangle.width - innerRectangle.width) / 2; 15 y = (windowRectangle.height - innerRectangle.height) / 2; 16 if (x < 0) x = 0; 17 if (y < 0) y = 0; 18 $(this.elements[i]).css([‘left = ‘ + (x + scroll.x) + ‘px‘, ‘top = ‘ + (y + scroll.y) + ‘px‘]); 19 } 20 return this; 21 });
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 特效插件: 遮罩锁屏 6 特效插件: 清除遮罩 7 */ 8 $().plugins([‘lock‘, ‘unlock‘], [function () { 9 var screen = null; 10 if ((screen = $(‘#screen‘).firstNode()) != this.info) { 11 if (Base.trim($(Base.comment(screen)).html()) != ‘‘) { 12 Base.removeElement(screen); 13 screen = Base.addElement(‘div‘, ‘id = screen‘); 14 } 15 } else { 16 screen = Base.addElement(‘div‘, ‘id = screen‘); 17 } 18 var scroll = Base.scroll(); 19 $(‘html‘).css(‘overflow‘, ‘hidden‘); 20 Base.scroll(scroll.x, scroll.y); 21 var windowRectangle = Base.getWindowRectangle(); 22 Base.absolute(screen); 23 $(screen).css([ 24 ‘width = ‘ + windowRectangle.width + ‘px‘, 25 ‘height = ‘ + windowRectangle.height + ‘px‘, 26 ‘left = ‘ + scroll.x + ‘px‘, 27 ‘top = ‘ + scroll.y + ‘px‘, 28 ‘backgroundColor = black‘, 29 ‘zIndex = 9998‘, 30 ‘opacity = 0.4‘, // W3C 31 ‘filter = alpha(opacity = 40)‘ // IE 6/7/8 32 ]).show(); 33 Base.fixed(); // 修正 Bug 34 return this; 35 }, function () { 36 var screen = null; 37 if ((screen = $(‘#screen‘).firstNode()) == this.info) return this; 38 var scroll = Base.scroll(); 39 $(‘html‘).css(‘overflow‘, ‘auto‘); 40 Base.scroll(scroll.x, scroll.y); 41 $(screen).hide(); 42 return this; 43 }]);
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 特效插件: 元素拖拽 6 */ 7 $().plugins(‘drag‘, function () { 8 var selector = null, childs = []; 9 for (var j = 0; j < this.elements.length; j ++) { 10 if (arguments.length != 0) { 11 for (var i = 0; i < arguments.length; i ++) { 12 if ((selector = $(this.elements[j]).selector(arguments[i]).getNodes()) == this.info) continue; 13 childs.push(selector); 14 } 15 } 16 if (childs.length == 0) childs.push(this.elements[j]); 17 var targetNode = this.elements[j]; 18 Base.absolute(targetNode); 19 var down = function (event) { 20 var scroll = Base.scroll(); 21 var outerRectangle = Base.getOuterRectangle(targetNode); 22 var fixedX = (event.clientX + scroll.x) - outerRectangle.left; 23 var fixedY = (event.clientY + scroll.y) - outerRectangle.top; 24 var windowRectangle = Base.getWindowRectangle(); 25 var innerRectangle = Base.getInnerRectangle(targetNode); 26 Tool.setCaptureIE(targetNode); // 兼容 IE Bug 27 var move = function (event) { 28 var x = (event.clientX + scroll.x) - fixedX; 29 var y = (event.clientY + scroll.y) - fixedY; 30 var minX = scroll.x, minY = scroll.y, maxX = 0, maxY = 0; 31 maxX = (windowRectangle.width + scroll.x) - innerRectangle.width; 32 maxY = (windowRectangle.height + scroll.y) - innerRectangle.height; 33 if (x < minX) x = minX; else if (x > maxX) x = maxX; 34 if (y < minY) y = minY; else if (y > maxY) y = maxY; 35 $(targetNode).css([‘left = ‘ + x + ‘px‘, ‘top = ‘ + y + ‘px‘]); 36 }; 37 var up = function () { 38 Tool.releaseCaptureIE(targetNode); // 兼容 IE Bug 39 $(document).nodeEvent(‘mousemove‘, move, false); 40 $(document).nodeEvent(‘mouseup‘, up, false); 41 }; 42 $(document).nodeEvent(‘mousemove‘, move); 43 $(document).nodeEvent(‘mouseup‘, up); 44 }; 45 for (var k = 0; k < childs.length; k ++) { 46 if (childs[k] instanceof Array) { // 集群 47 for (var l = 0; l < childs[k].length; l ++) { 48 $(childs[k][l]).nodeEvent(‘mousedown‘, down); 49 } 50 } else { // 单一 51 $(childs[k]).nodeEvent(‘mousedown‘, down); 52 } 53 } 54 } 55 return this; 56 });
1 /* 2 源码作者: 石不易(Louis Shi) 3 联系方式: http://www.shibuyi.net 4 =================================================================================================== 5 特效插件: 禁止元素溢出可视区 6 */ 7 $().plugins(‘overflow‘, function () { 8 var windowRectangle = Base.getWindowRectangle(); 9 var scroll = Base.scroll(); 10 var minX = scroll.x, minY = scroll.y, maxX = 0, maxY = 0, x = 0, y = 0; 11 var innerRectangle = null, outerRectangle = null; 12 for (var i = 0; i < this.elements.length; i ++) { 13 Base.absolute(this.elements[i]); 14 innerRectangle = Base.getInnerRectangle(this.elements[i]); 15 outerRectangle = Base.getOuterRectangle(this.elements[i]); 16 x = outerRectangle.left; 17 y = outerRectangle.top; 18 maxX = (windowRectangle.width + scroll.x) - innerRectangle.width; 19 maxY = (windowRectangle.height + scroll.y) - innerRectangle.height; 20 if (x < minX) x = minX; else if (x > maxX) x = maxX; 21 if (y < minY) y = minY; else if (y > maxY) y = maxY; 22 $(this.elements[i]).css([‘left = ‘ + x + ‘px‘, ‘top = ‘ + y + ‘px‘]); 23 } 24 return this; 25 });
关于 BETA 2.0 原型版核心源码与实例演示的获取请移动至官网下载！
感谢大家积极评测给予意见！
CNBlogs 博客：http://www.cnblogs.com/shibuyi/
CSDN 博客：http://blog.csdn.net/louis_shi/
ITeye 博客：http://shibuyi.iteye.com/