- id="sitelinks_text_96">
- id="sitelinks_text_78">
- id="sitelinks_text_94">
- id="sitelinks_text_91">
- id="sitelinks_text_79">
- id="sitelinks_text_81">
- id="sitelinks_text_77">
- id="sitelinks_text_82">
- id="sitelinks_text_80">
- id="sitelinks_text_83">
2、CSS樣式
[css] view plaincopy在CODE上查看代碼片派生到我的代碼片
body,div,dl,dt, dd,ul,ol,li ,h1,h2,h3,h4,h5,h6,pre,代碼,表單,字段集,圖例,輸入,按鈕,文字區域,p,區塊引用,th,td{邊距:0;填充: 0;}
table{border-collapse:collapse;border-spacing:0;}
ol,ul{list-style:none;}
a{color:#333;text-裝飾:無;}
a:hover{顏色:#f30;text-decoration:底線}
body{font-family:"宋體",Arail,verdana;font-size:12px;line -高度: 1.5em;顏色:#222;背景:#fff ;}
.clearfix:after{內容:".";顯示:塊;高度:0;清除:兩者;可見性: hidden;}
.clearfix{display:block;}
* html .clearfix{height:1%;}
.clear{clear:both;}
/* 文字顏色* /
.tr{text-align:right}
.tl{text-align:left;}
.tc{text-align:center;}
/*浮動* /
.fn-fl{float:left;}
.fn-fr{float:right;}
.m5{margin:5px;} .m10{margin:10px;}
.mt5 { 上邊距：5px;}.mr5 { 右邊距：5px;}.mb5 { 下邊距：5px;}.ml5 { 左邊距：5px;}
.mt10 { 邊距-頂部:10px; }.mr10 { 右邊距:10px;}.mb10 { 底邊距:10px;}.ml10 { 左邊距:10px;}
.p5{padding:5px;} . p10{padding:10px; }
.pt5 { padding-top:5px;}.pr5 { padding-right:5px;}.pb5 { padding-bottom:5px;}.pl5 { padding-left:5px;}
.pt10 { padding-top:10px;}.pr10 { padding-right:10px;}.pb10 { padding-bottom:10px;}.pl10 { padding-left:10px;}
。 mt30{margin-top:30px;}.mb30{margin-bottom:30px;}
.pt30{padding-top:30px;}.pb30{padding-bottom:30px;}
/*狀態無效*/
input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {background-color: #eee;cursor: not-allowed; box-shadow:none;opacity:0.5}
/*下拉列表*/
select{border:1pxsolid #ccc;border-radius:3px;padding:1px 2px;}
/*輸入框*/
輸入：-moz-placeholder,textarea:-moz-placeholder {color: #999999;}
輸入:-ms-input-placeholder,textarea:-ms-input-佔位元符{顏色：#999999;}
輸入::-webkit-input-placeholder,textarea::-webkit-input-placeholder {顏色：#999999;}
.txt,textarea,input [ type="text"], input[type="password"] {border: 1pxsolid #ccc;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;transition: 邊框0.2s 線性0s, box-shadow 0.2s 線性0s;border-radius:3px;padding:2px 3px;}
.txt:focus,textarea:focus,input[type="text"]:focus, input[type="password" ]:focus {邊框: 1pxsolid #2C5193;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) 插圖, 0 0 8px rgba(44, 81, 147, 0.6);字型大小：12px;行高：18px;}
.txt20{寬度：20px;}
.txt30{寬度：30px;}
.txt50{寬度：50px;}
.txt寬度:75px;}
.txt85{寬度:85px;}
.txt100{寬度:100px;}
.txt125{寬度:125px;}
.txt150{寬度:150px ; 🎜>.txt175{寬度:175px;}
.txt200{寬度:200px;}
.txt:250{寬度:250px;}
.txt280{寬度}280px;; ：300px;}
.txt350{寬度：350px;}
.txt400{寬度：400px;}
/*標準表格*/
.fn-table{寬度:100% ;}
.fn-table>tbody>tr>td{padding:3px;背景:#fff;邊框:1px 實體#CEDCED;}
.fn-table>tbody>tr>th{背景：# E3F5FF；填充：2px；邊框：1px 實心#CEDCED；字體粗細：粗體；}
.fn-table-space>tbody>tr:nth-child(2n 1)>td {background:# efefef;}
/*細線表格*/
.fn-table-line>tbody>tr>td{}
/*滑鼠懸停錶格*/
.fn-table-mouse>tbody>tr:nth-child(2n 1)>td{background:#efefef;}
.fn-table tr.on>tbody>tr>td,.fn -table-mouse >tbody>tr:hover>td{background:#FCF8E3;}
/*功能表格*/
.fn-table-function>tbody>tr>td:nth-child (2n 1) {背景:#E3F5FF;文字對齊:右;字體粗細:粗體;}
.fn-table-function>tbody>tr>td:first-child{背景:#E3F5FF;文字- align:right;font -weight:bold;}
/*乾淨的表格*/
.fn-table-clear{}
.fn-table-clear>tbody>tr>td{填充：3px；背景：#fff；邊框：無；}
.fn-table-clear>tbody>tr>th{背景：#E3F5FF；填滿：3px；邊框：無;}
/*iframe 頭部樣式，僅後台部分案例*/
.fn-iframe-hd{padding:2px 5px;background:#2C5193;margin-bottom:30px;line-height:22px;height:22px;color :#fff;位置:固定;左:0;頂部:0;寬度:100%;}
.fn-iframe-hd .close{background:url(/Manager/Themes/images/icons/filled.png ) 無重複中心center;float:right;width:14px;height:13px;cursor:pointer;padding:4px 5px;margin-right:10px;}
.fn-iframe-hd .close:hover{opacity :0.8;}
.fn-iframe-hd .tt{float:left;font-weight:bold;}
/*標準Tab選項卡*/
.fn-tab .hd li{float:left;margin-right:2px;padding:2px 5px;border:1pxsolid #2C5193;border-radius :border-radius : 5px 5px 0 0;遊標:指標;背景:#2C5193;顏色:#fff;}
.fn-tab .hd li.on{背景:#4B8AF9;顏色:#fff;邊框:1px 實心#4B8AF9 ; border-bottom:0;}
.fn-tab .bd{border:1pxsolid #ddd;padding:3px;margin-top:-1px;}
.fn-tab .bd div.item{顯示：無;}
.fn-tab .bd div.on{display:block;}
/*搜尋框*/
.fn-searchbar{border:1pxsolid #CEDCED; padding:2px ;border-radius:3px;}
.fn-searchbar 輸入,.fn-searchbar select{vertical-align:middle;}
/*分頁*/
.fn-分頁器{背景：#E3F5FF;邊框：1px 實心#CEDCED;邊距：0 0 5px;邊框頂部：0;}
.fn-分頁器div{行高：26px;空白：nowrap;word-中斷:break- all;}
.fn-pager input{margin-left:5px;}
.fn-pager a{border:1pxsolid #E3F5FF;； {背景：#2C5193;邊框：1px Solid #2C5193;顏色：#fff;padding:3px 5px;font-weight:bold;}
.fn-pager a:hover{背景:#2C5193 ;邊框:1px 實心：1px #2C5193;顏色:#fff;}
.fn-pager 輸入,.fn-pager 選擇,.fn-pager a,.fn-pager span{vertical-align:middle;}
.fn-pagerExt {float:right;margin-top:-22px;}
.fn-pagerExt input{vertical-align:middle;}
/*按鈕*/
.btn ,.fn-pager輸入[type='提交']{邊框半徑:3px;填充:1px 2px;邊框:1px 實心#B3B3B3;遊標:指針;背景圖像:線性漸變(到底部,#fff, #e6e6e6);框陰影：0 1px 0 rgba(255, 255, 255, 0.2) 插圖，0 1px 2px rgba(0, 0, 0, 0.05);顏色:#666;行高:20px;垂直對齊:中間;文字裝飾：無；填充： 1px 3px ;}
a.btn{填充：3px 6px;}
.btn:hover{背景：#eee;文字裝飾：無;}
.btn-on,.fn- pager input[type='submit']{背景圖像:線性漸變(到底部,#4b8af9,#2C5193);顏色:#fff;邊框顏色:rgba(0, 0,0,0.1) rgba(0,0, 0,0.1) rgba(0,0,0,0.1);背景顏色:#2C5193;邊框:1px 實心#2C5193 ;}
.btn-on:懸停,.fn-pager 輸入[type='提交']:懸停{背景:#4b8af9;顏色:#fff;}
.btn-gray{背景:線性漸變(到底部,#ccc ,#effefef);顏色:#fff;邊框顏色:rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.1);遊標:不允許;}
.btn-gray:hover{背景: #eee;text-decoration:none;}
.btn:active{box-shadow:inset 0 1px 2px rgba(0,0,0 ,.25),插入0 1px 3px rgba(0,00 ,0,0.15);}
#tooltip{位置：絕對；邊框：1px 實心#333；背景：#f7f5d1；填滿：2px 5px ;顏色：#333；顯示：無；寬度：500px； }
#tooltip{位置：絕對；顏色：#333；顯示：塊；背景顏色：#fff；邊框：1px 實心#555；框-陰影:0 0 10px rgba(0,0,0,.3 );邊框半徑:5px;填充:3px;最小寬度:160px;最小高度:80px;}
#tooltip img{邊框半徑:5px;}
/*文字大小*/
.font12{font-size:12px;}
.font13{font-size:13px;}
.font14{font-大小：14px;}
.font15{字體大小：15px;}
.font16{字體大小：16px;}
.font17{字體大小：17px;}
.font18{ font-size:18px;}
/*文字顏色*/
.font- red{顏色:紅色;}
.font-green{顏色:綠色;}
.font-white{顏色:白色;}
.font-gray{顏色:灰色;}
/*滑鼠標記*/
.hand{遊標:指標;}
3.主要js
jquery.js
ui.core .js
[javascript] view plaincopy在CODE上查看代碼片派生到我的代碼片
/*
* jQuery UI 1.7.1
*
*版權所有(c) 2009 AUTHORS.txt (http://jqueryui.com/about)
* 取得MIT 雙重授權(MIT-LICENSE.txt)
* 和GPL (GPL-LICENSE.txt) 許可證。
*
* http://docs.jquery.com/UI
*/
;jQuery.ui || (function($) {
var _remove = $. fn.remove,
isFF2 = $.browser.mozilla && (parseFloat($.browser.version) < 1.9);
//輔助函數與ui 物件
$.ui = {
version: "1.7.1",
// $.ui.plugin 已棄用，請改用代理模式。集合) {
var proto = $.ui[module].prototype;
for(var i in set) {
proto .plugins[i] = proto.plugins[i] || []; proto.plugins[i].push([選項, set[i]]); >call: function(instance, name, args) {
var set = instance.plugins[name];
if(! set || !instance.element[0].parentNode) { return; >
for (var i = 0; i < set.length; i ) {
if (instance.options[set[i][ 0]]) {
set[i][1] .apply(instance.element, args);
}
}
}
},
包含： function(a, b) {
return document.compareDocumentPosition
?a.compareDocumentPosition(b) & 16
: a !== b && a.contains(b);
},
hasScroll: function(el, a) {
//如果overflow被隱藏，元素可能有多餘的內容，但是使用者想要隱藏它
if ($(el).css ('overflow') == 'hidden') { return false ; }
var 捲動= (a && a == '左') ? 'scrollLeft' : 'scrollTop',
has = false ;
if (el[scroll] > 0) { return true; }
// TODO：確定哪些情況實際上會導致這種情況發生
// 如果元素沒有設定滾動，看看是否可以
// 設定滾動
el[滾動] = 1;
has = (el[scroll] > 0);
el[滾動] = 0;
回報有；
},
isOverAxis: function(x, reference, size) {
//判斷x座標何時超過「b」元素軸
return (x > reference) && ( x <(參考尺寸));
},
isOver: function(y, x, top, left, height, width) {
//判斷x,y座標何時超過「b」元素
return $ .ui.isOverAxis(y, 頂部, 高度) && $.ui.isOverAxis(x, 左, 寬度);
},
keyCode: {
退格: 8,
CAPS_LOCK: 20,
逗號: 188 ,
控制: 17,
刪除: 46,
向下：40，
結束：35，
輸入：13，
退出：27，
家：36 ，
插入：45，
左：37，
NUMPAD_ADD：107，
NUMPAD_DECIMAL：110，
NUMPAD_DIVIDE：111，
MPAMPAD_ENTER>NUMPAD_DIVIDE：111，
MPAMPAD_ENTER>NUMPAD_DIVIDE：111，
NUMPAD_ENTER：10860010707070303：7070707070703：0307070703：0303：NUFFS：10800001373：20707073：03033：0373：033：F37>
NUMPAD_SUBTRACT：109，
PAGE_DOWN：34，
PAGE_UP：33，
句點：190，
右：39，
SHIFT：16，
空格：空格： 🎜>TAB：9，
向上：38
}
}；
// WAI-ARIA 標準化
if (isFF2) {
var attr = $.attr ,
removeAttr = $.fn.removeAttr,
ariaNS = "http:// /www.w3.org/2005/07/aaa",
ariaState = /^aria-/,
ariaRole = /^wairole:/;
$.attr = function(elem, name, value) {
var set = value !== undefined;
return (name == 'role'
? (set
? attr.call(this, elem, name, "wairole:" value)
: (attr.apply(this , 參數) || "").replace( ariaRole, ""))
: (ariaState.test(name)
? (set
? elem.setAttributeNS(ariaNS,
name.replace) (ariaState, "aaa:"), value )
: attr.call(this, elem, name.replace(ariaState, "aaa:")))
: attr.apply(this, argument))) ;
}；
$.fn.removeAttr = function(name) {
return (ariaState.test(name)
? this.each(function() {
this.removeAttributeNS(ariaNS, name) .replace( ariaState, ""));
}) : removeAttr.call(this, name));
}；
}
//jQuery 外掛程式
$.fn.extend>
//jQuery 外掛程式
$.fn.extend>
//jQuery 外掛程式
$.fn.extend ({
remove: function() {
// Safari 有一個原生的移除事件，它實際上會移除DOM 元素，
// 所以我們必須使用triggerHandler 而不是trigger (#3037 )
$("*", this).add(this).each(function() {
$(this).
enableSelection: function() {
回傳這個
.attr('不可選擇', '關閉')
.css('MozUserSelect', '')
.unbind('selectstart.ui')
},
disableSelection : function() {
回傳這個
.attr('unselectable', 'on')
.css('MozUserSelect', 'none')
.bind('selectstart.ui' , function() { return false; });
scrollParent: function() {
varscrollParent;
if(($.browser.msie && (/(static|相對)/). test(this.css('position'))) || (/absolute/).test(this.css('position'))) {
scrollParent = this.parents().filter (function() {
return (/(relative|absolute|fixed)/).test($.curCSS(this,'position',1)) && (/(auto|scroll)/).test($ .curCSS(這, '溢出',1) $.curCSS(這,'溢出-y',1) $.curCSS(這,'溢出-x',1));
}).eq(0);
} else {
scrollParent = this.parents().filter(function() {
return (/(auto|scroll)/).test($.curCSS(this,'overflow',1) ) $ .curCSS(this,'overflow-y',1) $.curCSS(this,'overflow-x',1));
}).eq(0);
}
return (/fixed/).test(this.css('position')) || !scrollParent.length ? $(文檔) : 滾動父級；
}
});
//附加選擇器
$.extend($.expr[':'], {
data: function(elem, i, match) {
return !! $.data(elem , match[3]);
},
focusable: function(element) {
var nodeName = element.nodeName.toLowerCase(),
tabIndex = $ .attr(element, 'tabindex');
return (/input|select|textarea|button|object/.test(nodeName)
?!element.disabled
: 'a' == nodeName | | 'area' = = nodeName
? element.href || !isNaN(tabIndex)
: !isNaN(tabIndex))
// 元素及其所有祖先必須可見
/ / 瀏覽器可能會報告該區域被隱藏
&& !$(element)['area' == nodeName ? 'parents' : 'closest'](':hidden').length; 🎜>
tabable: function(element) {
var tabIndex = $.attr(element, 'tabindex');
return (isNaN(tabIndex) || tabIndex >= 0) && $(element ).is(':可聚焦');
}
});
// $.widget 是一個創建jQuery 插件的工廠
// 從插件程式碼中取出一些樣板程式碼
function getter(namespace, plugin, method, args) {
function getMethods(type) {
varmethods = $[namespace][plugin][type] || []；
return(typeofmethods=='string'?methods.split( /,?s/):methods);
}
varmethods = getMethods('getter');
if (args.length == 1 && typeof args[0] == 'string ') {
methods =methods.concat(getMethods('getterSetter'));
}
return ($.inArray(方法, 方法) != -1);
}
$.widget = 函數(name, 原型) {
var 命名空間= name.split(".")[0];
name = name.split(".")[ 1];
// 建立外掛方法
$.fn[name] = function(options) {
var isMethodCall = (typeof options == 'string'),
args = Array.prototype .slice.call(參數, 1);
// 阻止呼叫內部方法
if (isMethodCall && options.substring(0, 1) == '_') {
return this;
}
// 處理getter 方法
if (isMethodCall && getter(namespace, name, options, args)) {
var instance = $.data(this(this[000 ], name );
return (instance ? instance[options].apply(instance, args)
: undefined);
}
// 處理初始化和非getter 方法
return this.each(function() {
var instance = $.data(this, name);
// 建構子
(!instance && !isMethodCall &&
$. data(this, name, new $[namespace][name](this, options))._init()); 🎜>// 方法呼叫
(instance && isMethodCall && $.isFunction(instance[options]) &&
instance[options].apply(instance, args))
});
};
// 建立小元件建構子
$[namespace] = $[namespace ] || {};
$[命名空間][名稱] = 函數(元素, 選項) {
var self = this;
this.namespace = 命名空間；
this .widgetName = 名稱;
this.widgetEventPrefix = $[命名空間][名稱].eventPrefix ||名稱;
this.widgetBaseClass = 命名空間'-' 名稱;
this.options = 命名空間'-' 名稱;
this.options = $.extend({},
$.widget.defaults,
$[namespace][name].defaults,
$.metadata && $.metadata。 get(元素)[名稱],
選項);
this.element = $(element)
.bind('setData.' name, function(event, key, value) {
if (event.target == element) {
return self._setData(key, value);
}
})
.bind('getData.' name, function(event,, key) {
if (event.target == element ) {
return self._getData(key);
}
})
.bind('remove', function() {
return self.destroy();
} );
};
// 新增小部件原型
$[namespace][name].prototype = $.extend( {}, $.widget.prototype, prototype);
// TODO：合併小部件原型的getter 和getterSetter 屬性
// 和外掛程式原型
$[namespace][name]. getterSetter = 'option';
};
$.widget.prototype = {
_init: function() {},
destroy: function() {
this.el},
destroy: function() {
this.element .removeData(this.widgetName)
. removeClass(this.widgetBaseClass '-disabled' ' ' this.namespace '-state-disabled')
.removeAttr('aria-disabled');
},
選項: 函數(鍵, 值) {
var options = key,
self = this;
if (typeof key == "string") {
if (typeof key == "string") {
if (value === undefined) {
return this._getData(key);
}
選項= {};
選項[鍵] = 值；
}
$.each(選項, 函數(鍵, 值) {
self._setData(鍵, 值);
});
},
_getData: function(key) {
return this.options[key];
},
_setData: function(key, value) {
this.options[key] = value;
if (key == '停用') {
this.element
[值? 'addClass' : 'removeClass'](
this.widgetBaseClass '-disabled' ' '
this.namespace '-state-disabled')
.attr("aria-disabled", value);
}
},
enable: function() {
this._setData('disabled', false);
},
disable: function() {
this._setData('disabled', true);
},
_trigger: function(type, event, data) {
var callback = this.options[type],
eventName = (type == this.widgetEventPrefix
類型：this.widgetEventPrefix 類型）；
事件= $.Event(Event) ;
event.type = eventName;
// 將原始事件屬性複製到新事件
// 如果我們可以呼叫$.event.fix 而不是$.Event
//就會發生這種情況
// 但我們沒有強制多次修復事件的方法
if (event.originalEvent) {
for (var i = $.event.props.length, prop; i ;) {
prop = $. event.props[--i];
event[prop] = event.originalEvent[prop];
}
}
this. element.trigger(事件, 資料);
return !($.isFunction(callback) && callback.call(this.element[0], event, data) === false
|| event .isDefaultPrevented());
}
};
$.widget.defaults = {
停用: false
};
** *滑鼠互動插件 **/
$.ui.mouse = {
_mouseInit: function() {
var self = this;
this.element
.bind ('mousedown.' this.widgetName, function(event) {
return self._mouseDown(event);
})
.bind( '點擊。 ' this.widgetName, function(event) {
if(self._preventClickEvent) {
self._preventClickEvent = false;
event.stopImmediatePropagation()
回傳false; } <🎜se>};
// 阻止IE 中的文字選擇
if ($.browser.msie) {
this._mouseUnselectable = this.element.attr('unselectable');
this.element .attr('不可選擇', '開啟'); <🎜>} <🎜><🎜>this.started = false; <🎜>},
// TODO：確保銷毀一個滑鼠實例不會幹擾
// 滑鼠的其他實例
_mouseDestroy: function() {
this.element.unbind( '.' this .widgetName);
// 恢復IE 中的文字選擇
($.browser.msie
&& this.element.attr('unselectable', this._mouseUnselectable));
},
_mouseDown: function(event) {
// 不要讓多個小部件處理mouseStart
// TODO：弄清楚為什麼我們必須使用originalEvent
事件.originalEvent = 事件.originalEvent || {};
if (event.originalEvent.mouseHandled) { return; }
// 我們可能錯過了mouseup（在視窗外）
(this._mouseStarted && this. _mouseUp(event));
this._mouseDownEvent = 事件;
var self = this,
btnIsLeft = (event.which == 1),
elIsCancel = (Left = (event.which == 1),
elIsCancel = (Left = (event.which == 1),
elIs” this.options.cancel == "string" ? $(event.target). parents().add(event.target).filter(this.options.cancel).length : false);
if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) {
回傳true;
}
this.mouseDelayMet = !this.options.delay;
if (!this.mouseDelayMet.motions. ) {
this._mouseDelayTimer = setTimeout(function() {
self.mouseDelayMet = true;
}, this.options.delay);
}
if (this. _mouseDistanceMet(event) && this._mouseDelayMet(event)) {
this._mouseStarted = (this._mouseStart(event) !== false);
if (!this._mouseStarted) { event.preDefault ();
回傳真;
}
}
// 這些委託需要保留上下文
this._mouseMoveDelegate = function(event) {
return self._mouseMove( event);
};
this._mouseUpDelegate = function(event) {
return self._mouseUp(event);
};
$(文檔)
.bind(' mousemove.' this.widgetName, this._mouseMoveDelegate)
.bind('mouseup.' this.widgetName, this._mouseUpDelegate);
// PreventDefault() 用於阻止此處選擇文字-
// 但是，在Safari 中，這會導致選擇框不再可選
//，因此此修復是需要
($.browser.safari || event.preventDefault());
event.originalEvent.mouseHandled = true;
回傳真；
},
_mouseMove: function(event) {
// IE mouseup 檢查- 當滑鼠離開視窗時發生mouseup
if ($.browser.msie && !event.button ) {
回傳this._mouseUp(event);
}
if (this._mouseStarted) {
this._mouseDrag(event);
回傳event.preventDefault();
}
if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
this._momouseed =
(this._mouseStart(this._mouseDownEvent, event) != =假）;
(this._mouseStarted ? this._mouseDrag(event) : this._mouseUp(event));
}
}
return !this._mouseStarted;
},
_mouseUp: 函數(事件) {
$(文檔)
.unbind('mousemove.' this.widgetName, this ._mouseMoveDelegate)
.unbind(' mouseup.' this.widgetName, this._mouseUpDelegate);
if (this._mouseStarted) {
this._mostStarted = false; = (event.target == this._mouseDownEvent.target);
this._mouseStop(事件);
}
回傳false;
},
回傳false;
},
|
