使用Mootools動(dòng)態(tài)添加Css樣式表代碼,兼容各瀏覽器
更新時(shí)間：2011年12月12日 20:58:37 作者：
這個(gè)函數(shù)很有用處,尤其是當(dāng)我們?cè)谑褂肕ootools開(kāi)發(fā)插件的時(shí)候,例如Tips等,當(dāng)我們需要額外的Css來(lái)支撐插件內(nèi)的效果時(shí),通常我們的做法是把Css放到單獨(dú)的css文件里調(diào)用
但是這樣做就不利于插件的移植,所以就寫了這個(gè)函數(shù)用來(lái)動(dòng)態(tài)產(chǎn)生Css.
AddCss=function(c){
var Sty=document.createElement('style');
Sty.type='text/css';
if(Browser.ie){
Sty.styleSheet.cssText=c;
}else{
var Frag=document.createDocumentFragment();
Frag.appendChild(document.createTextNode(c));
Sty.appendChild(Frag);
}
document.getElementsByTagName('head')[0].appendChild(Sty);
};
AddCss('a{background-color:red;color:black;padding:20px;}');
代碼如上所示,比較簡(jiǎn)單就是一個(gè)Function而已,需要的時(shí)候就直接用AddCss添加代碼即可.
注:該函數(shù)我在IE6;7;8;9以及Firefox內(nèi)均已測(cè)試過(guò),可以放心使用.
復(fù)制代碼 代碼如下:
AddCss=function(c){
var Sty=document.createElement('style');
Sty.type='text/css';
if(Browser.ie){
Sty.styleSheet.cssText=c;
}else{
var Frag=document.createDocumentFragment();
Frag.appendChild(document.createTextNode(c));
Sty.appendChild(Frag);
}
document.getElementsByTagName('head')[0].appendChild(Sty);
};
AddCss('a{background-color:red;color:black;padding:20px;}');
代碼如上所示,比較簡(jiǎn)單就是一個(gè)Function而已,需要的時(shí)候就直接用AddCss添加代碼即可.
注:該函數(shù)我在IE6;7;8;9以及Firefox內(nèi)均已測(cè)試過(guò),可以放心使用.
相關(guān)文章
Mootools 1.2教程 選項(xiàng)卡效果（Tabs）
今天將不只是受限于這個(gè)庫(kù)和一些基本的編程知識(shí)，我們來(lái)做一個(gè)簡(jiǎn)單的小項(xiàng)目。通過(guò)使用我們目前為止已經(jīng)學(xué)過(guò)的一些知識(shí)，有幾種方式來(lái)創(chuàng)建當(dāng)鼠標(biāo)移上去或者點(diǎn)擊時(shí)顯示相應(yīng)內(nèi)容的tab。2009-09-09
有人最近要求我們寫一個(gè)關(guān)于MooTools 1.2的30天的教程，這似乎也是個(gè)很不錯(cuò)的主意，于是我們決定現(xiàn)在就開(kāi)始。在這些教程中，我們假設(shè)用戶沒(méi)有任何MooTools或者是JavaScript經(jīng)驗(yàn)，但是至少有基本的HTML和CSS知識(shí)。2009-09-09
通過(guò)Mootools 1.2來(lái)操縱HTML DOM元素
今天我們來(lái)深入地學(xué)習(xí)一下如果操縱HTML元素。通過(guò)MooTools 1.2，你可以添加新元素到一個(gè)HTML頁(yè)面中，也可以刪除元素，以及改變?nèi)魏螛邮交蛘咴貐?shù)，這些都非常容易。2009-09-09
今天我們將來(lái)看一下MooTools綁定的Tooltip插件。通過(guò)“提示（Tips）”，你可以輕松地自定義一個(gè)包含一個(gè)標(biāo)題和內(nèi)容的工具提示，可以自定義樣式，自定義淡入淡出漸變效果。2009-09-09
一些mootools的學(xué)習(xí)資源，學(xué)習(xí)mootools的朋友可以參考下。2010-02-02
講一講JavaScript中的函數(shù)（function）的基本知識(shí)。2009-09-09
MooTools 頁(yè)面滾動(dòng)浮動(dòng)層智能定位實(shí)現(xiàn)代碼
MooTools 頁(yè)面滾動(dòng)浮動(dòng)層智能定位實(shí)現(xiàn)代碼，需要的朋友可以參考下。2011-08-08
Mootools 1.2教程(3) 數(shù)組使用簡(jiǎn)介
在上一篇教程——《Mootools 1.2教程(2)——DOM選擇器》中，我們介紹了一下選擇器，其中有很多方法就會(huì)返回?cái)?shù)組（一個(gè)你可以對(duì)其中內(nèi)容進(jìn)行多種操作的特殊列表）。2009-09-09
Mootools 1.2 手風(fēng)琴（Accordion）教程
繼續(xù)我們的“更多”（More）庫(kù)里面的插件教程，今天我們來(lái)學(xué)習(xí)一下可能是最流行最受歡迎的插件——手風(fēng)琴。2009-09-09
Mootools 1.2教程 滑動(dòng)效果（Slide）
今天繼續(xù)我們的Mootools 1.2教程的第23課，我們今天來(lái)講一下Fx插件中的Fx.Slide。通過(guò)該插件，可以讓你把內(nèi)容以滑動(dòng)的方式顯示出來(lái)。它使用起來(lái)非常簡(jiǎn)單，是你UI工具箱中一個(gè)很好的工具。2009-09-09