sciactive / pnotify

Beautiful JavaScript notifications with Web Notifications support.
https://sciactive.com/pnotify/
Apache License 2.0
3.65k stars 513 forks source link

Getting height from PNotify #334

Closed WRobynson closed 6 years ago

WRobynson commented 6 years ago

Hi,

I'm using PNotify with ajax to show "title" dynamically. So when the clicked object is on the bottom from page, the notify doesn't apper properly. I need know the height (which varies with the ajax result) to properly position the stach.

I have something like this:

`function shToolTip(user, id){ var p = $("#"+id);

var position = p.offset();  
var scroll = $(document).scrollTop();
var winHeight = $(window).height(); 

var NotifyWidth = 260;  // THIS CAN BE FIXED

var top = position.top - scroll;
var left = position.left - NotifyWidth; 

$.ajax({
    url:'ajax/tooltip.ajax.php',
    type:'post',
    data:{
        userid: user,
    },
    success: 
        function(html){
            etiqueta = new PNotify({
                title: '',
                text: html,
                hide: false,
                buttons: {
                    closer: false,
                    sticker: false
                },
                history: {
                    history: false
                },
                width: "250px",
                animate_speed: 'fast',
                icon: 'fa fa-commenting',
                // Setting stack to false causes PNotify to ignore this notice when positioning.
                stack: false,
                auto_display: false,
                styling: 'bootstrap3'
            });

            //  NOTIFY DIV
            //  HERE I NEED TO KNOW THE HEIGHT FROM NOTIFY
            //  I NEED GET IT AUTOMATICALLY, BECAUSE THE AJAX RESULT IS DYNAMIC

            var heightLabel = etiqueta.height();    // THIS NOT WORK!!!!!!

            if (top + heightLabel > winHeight)
            top = top - (top + heightLabel - winHeight);

            etiqueta.get().css({'top': top, 'left': left});
            etiqueta.open();
        }
});

}`

Tank you.

hperrin commented 6 years ago

Hi @WRobynson,

etiqueta is a PNotify object, so it has no height method. You can get its scrollheight with etiqueta.elem.get(0).scrollHeight, or if you want to use jQuery, you can do etiqueta.elem.height() or etiqueta.get().height().

Keep in mind, that is only for v3. In v4, the get method is for getting PNotify option values. Instead, you would use etiqueta.refs.elem.scrollHeight in v4.

WRobynson commented 6 years ago

It works perfectly!!!

Thanks a lot, @hperrin .