首先呢,是必不可少的css样式:
.tc_div{background: #fff;border: 1px solid #cdcdcd;width: 200px;border-radius: 5px;box-shadow: 0px 2px 10px #CECACA;position: absolute;}
.tc_div h3{background: #E4E4E4;font:bold 15px Arial,Microsoft Yahei;padding: 4px 8px;margin: 0;border-bottom: 1px solid #cdcdcd;border-radius: 5px 5px 0 0;}
.tc_div h3 b{float: right;cursor: pointer;}
.tc_div p{padding: 6px 8px;}
接着是超文本标记语言HTML代码:
我是无良弹窗君 ( *・ω・)✄ <a id="tc_click" style="text-decoration: underline;" href="###"> 敢戳我?分分钟弹死你!</a>
最后,最重要的javascript代码来了:
<script>// <![CDATA[
/* div弹出层 */
$(document).ready(function() {
function doing(Min, Max, Time, Pl, Pt) { /* Min 最少弹出数 Max 最大弹出数 Time 延迟时间 Pl 距离左侧最大百分比 Pt 距离顶部最大百分比 */
if (isNaN(Min) || isNaN(Max) || isNaN(Time) || isNaN(Pl) || isNaN(Pt)) return false; /* 判断输入的是否是数字 */
run = setInterval(function() {
if ((Min > Max - 1) && (Max != 0)) clearInterval(run); /* 如果超过最大弹出数则停止 Max为0则无限弹出 */
pl = parseInt(Math.random() * Pl + 1); /* 随机 1~Pl */
pt = parseInt(Math.random() * Pt + 1); /* 随机 1~Pt */
tc_div = '
<div id="tc_div_' + Min + '" class="tc_div">
<h3>小弹窗 No.' + Min + ' <b class="close">×</b></h3>
我是第' + Min + '个小弹窗
</div>
';
$(".tc_main").append(tc_div);
$("#tc_div_" + Min).css({left: pl + "%",top: pt + "%", "z-index": "100"});
Min++; /* 自增 */
},
Time);
}
/* 浏览器弹窗 */
function RunAlert() {
var i, o, x, z = 10; /* z 弹出次数 */
if (confirm("(●′ω`●) 分分钟弹死你,你信不信?")) { /* 信则弹10*10*10次 不信再说 */
for (i = 1; i <= z; i++) {
alert("(= ̄ω ̄=) 霸气第" + i + "弹");
for (o = 1; o <= z; o++) {
alert("(= ̄ω ̄=) 霸气第" + i + "弹 \n(。・`ω´・) 骚气第" + o + "弹");
for (x = 1; x <= z; x++) {
alert("(= ̄ω ̄=) 霸气第" + i + "弹 \n(。・`ω´・) 骚气第" + o + "弹 \n( ̄へ ̄) 合体第" + x + "弹");
}
}
}
} else {
alert("╮( ̄⊿ ̄\")╭ 切,量你也没这个胆子!");
if (confirm("(ง •̀ω•́)ง 试试新玩法?")) { /* 询问是否换个花样 */
$(".tc_main").empty();
doing(1, 0, 100, 85, 88); /* 每100毫秒弹一次 弹到屎 */
} else {
alert("(′◔◞౪◟◔) 原来是个胆小鬼!一边玩去!");
return false;
}
}
}
$("#tc_click").click(function() { /* 敢点就敢弹 */
RunAlert();
});
$(".tc_main").click(function(e) {
var id = e.target.offsetParent.id;
$("#" + id).css("z-index", "+=1"); /* 堆叠层数+1 */
if (e.target.className == "close") {
$("#" + id).remove(); /* 如果手速快 每个弹窗都可以关掉 */
}
})
})
// ]]></script>
本文共 244 个字数,平均阅读时长 ≈ 1分钟
评论 (0)