自制轻量级仿jQuery.boxy对话框插件代码

2020-05-19 07:33:15易采站长站整理

}
.cvBoxBorder A {
COLOR: #486aaa; TEXT-DECORATION: none
}
.cvBoxBorder A:hover {
COLOR: #c00; TEXT-DECORATION: none
}
.cvBoxTitleBar {
WIDTH: 100%; LINE-HEIGHT: 27px; HEIGHT: 26px; BACKGROUND-COLOR: #eeeeee
}
.cvBoxTitleBarText {
PADDING-LEFT: 10px; FONT-WEIGHT: bold; FLOAT: left; COLOR: #333
}
.cvBoxTitleBarClose {
PADDING-RIGHT: 10px; FLOAT: right; COLOR: #3867af; FONT-FAMILY: Verdana
}
.cvBoxTitleBarClose IMG {
BORDER-TOP-WIDTH: 0px; DISPLAY: block; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 4px 0px 0px; BORDER-RIGHT-WIDTH: 0px
}
.cvBoxBody {
WIDTH: 100%; BACKGROUND-COLOR: #ffffff
}
.cvBoxBodyBtn {
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 20px; PADDING-TOP: 20px
}
.cvBoxBodyBtn P {
MARGIN: 20px 0px 0px
}
.cvBoxBtnSubmit {
BORDER-RIGHT: #34538b 1px solid; BORDER-TOP: #34538b 1px solid; BACKGROUND: #486aaa; BORDER-LEFT: #34538b 1px solid; WIDTH: 60px; CURSOR: pointer; COLOR: #fff; LINE-HEIGHT: 23px; BORDER-BOTTOM: #34538b 1px solid; HEIGHT: 24px
}
.cvBoxBtnCancel {
BORDER-RIGHT: #ccc 1px solid; BORDER-TOP: #ccc 1px solid; BACKGROUND: #eee; BORDER-LEFT: #ccc 1px solid; WIDTH: 60px; CURSOR: pointer; COLOR: #333; LINE-HEIGHT: 23px; BORDER-BOTTOM: #ccc 1px solid; HEIGHT: 24px
}
.cvBoxClear {
CLEAR: both; PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FONT-SIZE: 1px; PADDING-BOTTOM: 0px; MARGIN: 0px; LINE-HEIGHT: 1px; PADDING-TOP: 0px
}
</style>
<body>
<div>
未压缩版本是6K大小,压缩后只有2K大,应该算很轻了。</div>
<div> </div>
<div id=”jquerycvbox”>
<div>
<a id=”A1″ href=”javascript:void(0);”>1.弹出提示框,点击查看效果。</a>
<script type=”text/javascript”>// <![CDATA[
$(“#A1”).click(function() {
$(this).cvbox({
titleBarText: “弹出提示框”,
alertText: “世界上最远的距离不是生与死的距离<br />而是我在你面前<br />你却不知道我爸爸是李刚”
});
});
// ]]></script>
</div>
<div class=”jb51_Highlighter”>
<pre class=”brush:javascript”>$(this).cvbox({
titleBarText: “弹出提示框”,
alertText: “世界上最远的距离不是生与死的距离<br />而是我在你面前<br />你却不知道我爸爸是李刚”
});
</pre>
</div>
<div>
<a id=”A2″ href=”javascript:void(0);”>2.弹出提示框1秒后自动关闭,点击查看效果。</a>
<script type=”text/javascript”>// <![CDATA[
$(“#A2”).click(function() {
$(this).cvbox({
titleBarText: “弹出提示框1秒后自动关闭”,
alertText: “世界上最远的距离不是生与死的距离<br />而是我在你面前<br />你却不知道我爸爸是李刚”,