对这个不熟悉。。
我看石头君是这样写的。
(function () {
if (window.CSSStyleSheet) {
CSSStyleSheet.prototype.addRule = function (a, b) {
var wc = this;
wc.insertRule(a + "{" + b + "}", wc.cssRules.length);
};
})();这些有什么基本的区别?
我看石头君是这样写的。
(function () {
if (window.CSSStyleSheet) {
CSSStyleSheet.prototype.addRule = function (a, b) {
var wc = this;
wc.insertRule(a + "{" + b + "}", wc.cssRules.length);
};
})();这些有什么基本的区别?
嘿嘿。。
this.sso.sheet.length是undefined
this.sso.sheet.cssRules.length有值
这段代码可以分成两个部分
CommonDiv 是用来创建一个内嵌iframe的div的,就这么简单
StyleSheet是用来创建样式表并添加到文档的head中的,也这么简单支持IE6和FF2干嘛用呢,很多时候,都需要弹出一个div为载体显示一些内容,如:日历,tooltips,右键菜单 and so on. 颇为苦恼的是div总是被select穿透,常用的解决方法就是加一个iframe.于是我把这个过程封装出来,让开发人员可以自由的调用,自由的设置样式.这段代码只实现了最基本的功能,并没有任何扩展,需要开发人员根据需要进行修改.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>CommonDiv</title>
<style type="text/css">
html {
background-color:#000000;
}
</style>
<script type="text/javascript">
(function () {
if (window.CSSStyleSheet) {
var wc = window.CSSStyleSheet.prototype;
wc.addRule = function (a, b) {
var wc = this;
wc.insertRule(a + "{" + b + "}", wc.cssRules.length);
};
wc.removeRule = function (a) {
var wc = this;
wc.deleteRule(a);
};
wc.__defineGetter__("rules", new Function("return this.cssRules"));
}
})();
var wc = document.styleSheets[0];
alert(wc.rules[0].selectorText + ":" + wc.rules[0].style.cssText);
wc.removeRule(0);
</script>
</body>
</html>
1.1 调用1 ---/--------------------------------------内容:1.1 调用1
<style type="text/css">
/* <![CDATA[ */
.sqCoupletMainClassName
{
white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
background-color:white;
}.sqCoupletCloseBtn
{
text-align:right;
border:4px solid #E0E0E0;
}.sqCoupletCloseBtn span
{
padding:2px 5px;
}.sqCoupletTextClassName
{
border:5px solid #E0E0E0;
margin:2px 0px;
padding:2px;
text-align:center;
}
/* ]]> */
</style>
<script type="text/javascript">
//<![CDATA[
/*----------------UI---------------------*/
//im.go('UI.Rounded');
//im.help('UI.Rounded', true);
//-
im.go('UI.Couplet');
//im.help('UI.Couplet', true);
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
var cpl = new Couplet();
cpl.Go();
cpl = null;
//]]>
</script>
2. 类 Couplet
// shawl.qiu JavaScript Document
/*-----------------------------------------------------------------------------------*\
* shawl.qiu javascript Couplet class v1.0
\*-----------------------------------------------------------------------------------*/
//---------------------------------begin class Couplet()-------------------------------//
function Couplet()
{ // shawl.qiu code
//------------------------------------begin public variable
//---------------begin about
this.auSubject = 'shawl.qiu javascript Couplet class';
this.auVersion = 'v1.0';
this.au = 'shawl.qiu';
this.auEmail = '[email protected]';
this.auBlog = 'http://blog.csdn.net/btbtd';
this.auCreateDate = '2007-5-16';
//---------------end about
this.OffsetWidth = 110;
this.OffsetTop = 60;
this.OffsetLeft = 5;
this.OffsetRight = 5;
this.ClassName = {};
this.ClassName.Main = "sqCoupletMainClassName";
this.ClassName.Text = "sqCoupletTextClassName"
this.Closer = {};
this.Closer.Class = {};
this.Closer.Class.Name = "sqCoupletCloseBtn";
this.Closer.Go = fCloserGo;
this.LeftPart = {};
this.LeftPart.ID = "sqCoupletLeftPart";
this.LeftPart.Text = {};
this.LeftPart.Text.ID = "sqCoupletLeftPartTextId";
this.LeftPart.Text.InnerHtml = "test............\r\n.............\r\n.............\r\n...........";
this.RightPart = {};
this.RightPart.ID = "sqCoupletRightPart";
this.RightPart.Text = {};
this.RightPart.Text.ID = "sqCoupletRightPartTextId";
this.RightPart.Text.InnerHtml = "test............\r\n.............\r\n.............\r\n...........";
this.Count = 1;
//------------------------------------end public variable
//------------------------------------begin private variable
var Tl = this;
var pLeftPart = null;
var pRightPart = null;
//------------------------------------end private variable
//------------------------------------begin public method
this.Go = fGo;
//------------------------------------end public method
//------------------------------------begin private method
function fGo()
{
/* start left part */
var EleDivLeft = document.createElement("div");
EleDivLeft.id = Tl.LeftPart.ID;
EleDivLeft.className = Tl.ClassName.Main;
with(EleDivLeft.style)
{
if(fCkBrs()!=1)
{
position = "fixed";
}
else
{
position = "absolute";
}
left = Tl.OffsetLeft+"px";
top = Tl.OffsetTop+"px";
width = Tl.OffsetWidth+"px";
} // end with
document.body.appendChild(EleDivLeft);
pLeftPart = document.getElementById(Tl.LeftPart.ID);
var CloseSpan = document.createElement("span");
CloseSpan.innerHTML = "X";
CloseSpan.onclick = Tl.Closer.Go;
var EleCloseLeft = document.createElement("div");
EleCloseLeft.className = Tl.Closer.Class.Name;
EleCloseLeft.appendChild(CloseSpan);
var EleLeftPartText = document.createElement("div");
with(EleLeftPartText)
{
id = Tl.LeftPart.Text.ID;
className = Tl.ClassName.Text;
innerHTML = Tl.LeftPart.Text.InnerHtml;
}
pLeftPart.insertBefore(EleCloseLeft, pLeftPart.firstChild);
pLeftPart.appendChild(EleLeftPartText);
/* end left part */
/* start right part */
var EleDivRight = document.createElement("div");
EleDivRight.id = Tl.RightPart.ID;
EleDivRight.className = Tl.ClassName.Main;
with(EleDivRight.style)
{
if(fCkBrs()!=1)
{
position = "fixed";
}
else
{
position = "absolute";
}
right = Tl.OffsetRight+"px";
top = Tl.OffsetTop+"px";
width = Tl.OffsetWidth+"px";
} // end with
document.body.appendChild(EleDivRight);
pRightPart = document.getElementById(Tl.RightPart.ID);
var CloseSpan = document.createElement("span");
CloseSpan.innerHTML = "X";
CloseSpan.onclick = Tl.Closer.Go;
var EleCloseRight = document.createElement("div");
EleCloseRight.className = Tl.Closer.Class.Name;
EleCloseRight.appendChild(CloseSpan);
var EleRightPartText = document.createElement("div");
with(EleRightPartText)
{
id = Tl.RightPart.Text.ID;
className = Tl.ClassName.Text;
innerHTML = Tl.RightPart.Text.InnerHtml;
}
pRightPart.insertBefore(EleCloseRight, pRightPart.firstChild);
pRightPart.appendChild(EleRightPartText);
/* end right part */
if(fCkBrs()==1)
{
onscroll = fScrollForIe;
}
} // end function fGo
function fCloserGo()
{
var bCfm = confirm('现在关闭对联吗?');
if(bCfm)
{
if(pLeftPart!=null)
{
pLeftPart.style.display = "none";
}
if(pRightPart != null)
{
pRightPart.style.display = "none";
}
}
} // end function fCloserGo
function fScrollForIe()
{
if(pLeftPart!=null)
{
pLeftPart.style.top = document.documentElement.scrollTop + Tl.OffsetTop+ "px";
}
if(pRightPart!=null)
{
pRightPart.style.top = document.documentElement.scrollTop + Tl.OffsetTop+ "px";
}
} // end function fScrollForIe
function fCkBrs()
{
switch (navigator.appName)
{
case 'Opera': return 2;
case 'Netscape': return 3;
default: return 1;
}
} // end function fCkBrs
function fInsertNode(OldNode, NewNode, bBefore)
{// shawl.qiu script
var ParentNode = OldNode.parentNode;
if(!ParentNode)return false;
if(bBefore)
{
ParentNode.insertBefore(NewNode,OldNode);
return false;
} // end if
ParentNode.replaceChild(NewNode, OldNode);
ParentNode.insertBefore(OldNode, NewNode);
} // end function fInsertNode
//------------------------------------end private method
} // shawl.qiu code
//---------------------------------end class Couplet()---------------------------------//
var couplet = new Couplet();