学习 $.messager.show 的简单使用

来源：互联网发布：mac下制作win7安装u盘编辑：程序博客网时间：2024/05/17 04:21

一、在鼠标点击的位置弹出框！

function showBySite(event) {        var element = document.elementFromPoint(event.x, event.y);//获取点击对象    $.messager.showBySite({        title: 'My Title',        msg: 'Message.',        showType: 'show'    }, {        top: $(element).position().top + $(element).height(),//将$.messager.show的top设置为点击对象之下        left: $(element).position().left,//将$.messager.show的left设置为与点击对象对齐        bottom: ""    });}/** * 指定位置显示$.messager.show * options $.messager.show的options * param = {left,top,right,bottom} */$.extend($.messager, {    showBySite: function (options, param) {        var site = $.extend({            left: "",            top: "",            right: 0,            bottom: -document.body.scrollTop                    - document.documentElement.scrollTop        }, param || {});        var win = $("body > div .messager-body");        if (win.length <= 0)            $.messager.show(options);        win = $("body > div .messager-body");        win.window("window").css({            left: site.left,            top: site.top,            right: site.right,            zIndex: $.fn.window.defaults.zIndex++,            bottom: site.bottom        });    }});

2、在页面的右下角弹出框。

$.messager.show({                        title: "推荐成功",                        msg: "您推荐的新闻是：<br/><span style=\"color:red;\">" + newstitle + "</span>",                        showType: 'slide',                        width: 300,                        height: 150,                        timeout: 2000                    });

注：如果在网页中的框架（iframe）中，那么弹框也会在iframe的最右下角！

0 0