首页 > 代码库 > 我的第三个jquery插件——promptForK13内容提示插件
我的第三个jquery插件——promptForK13内容提示插件
jQuery提示插件,默认css样式使用了css3属性,所以最好在火狐或谷歌等标准浏览器下浏览。可自定义提示框结构及样式。 下载
可设参数:
"addID": "", //追加ID,方便自定义控制
"addClass": "", //追加class,方便自定义控制
"dom": "", //自定义dom结构
//最外面的元素必须以.prompt_k13包裹
//内部必须有.content_k13空元素存放文字
//.close_btn_k13关闭按钮可根据需要添加
//无论几层嵌套都可,不可换行,例如:
//<div class="prompt_k13"><span class="close_btn_k13">关闭</span><div class="content_k13"></div></div>
"closeBtn": true, //是否显示关闭按钮
"autoClose": true, //是否自动关闭
"autoCloseTime": 5000, //自动关闭延时,单位毫秒
"animate": true, //是否显示动画效果
"animateTime": 300, //动画时长,单位毫秒
"animateLength": 30, //动画移动距离,单位px
"gap": 8, //与父元素间隙,单位px
"close": false, //控制关闭
"text": "这里是提示内容", //提示内容
"position": "right" //提示位置.top上边,left左边,right右边,bottom下边,默认右边
功能:
1.可设置上下左右四个方向弹出
2.可手动或自动关闭
3.可设置有无动画效果以及动画时长
4.可自定义弹出dom结构,所有外观均可用css改变
下载地址
示例:
页面引入:
<script type="text/javascript" src="http://www.mamicode.com/script/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://www.mamicode.com/script/promptForK13.min.js"></script>
调用方法:
如果使用默认设置,如下:
$("#demo").promptForK13();
如果自定义参数,如下:
$(this).promptForK13({
"addClass": "prompt_top",
"text":"点击X才能关闭",
"position": "top",
"autoClose": false
});
html:
<div id="demo"></div>
自己写了几个示例放在 打包文件 中,效果如下图:
我的第三个jquery插件——promptForK13内容提示插件