Custom Notification and Footer Tabs BUG

ckhsu3926 commented 7 years ago

I am use custom notification and footer tabs at same page(wether default page or not get same bug).

And then tab buttons have no response for change tab (but swipe work fine). After debug with Chrome Inspect, I find out even notification was hide, It still keep some height from bottom and cover on footer tabs.

After tried z-index to notification , nav , tab-items , tab-item My final solution is

deviceReady{
    document.querySelector('#notification_id').style.height="0px";
}

document.querySelector('#notification_id').style.height="";
phonon.notif('#notification_id').show();

document.querySelector('#notification_id').style.height="0px";
phonon.notif('#notification_id').hide();

Dirty but it works fine.

qathom commented 7 years ago

Hi @ckhsu3926,

Thank you for opening this issue. I can't reproduce your bug.. Is your custom notification outside your page wrapper? Example:

...
<body>
    <div class="notification" id="notification_id">...</div>

    <!-- Then page declaration -->
    <home data-page="true">...</home>
    ...
</body>

ckhsu3926 commented 7 years ago

@Qathom thanks for reply.

In my case, I've tried

<body>
    <div class="notification" id="notification_id">...</div>
    ...
    <home data-page="true">...</home>
    ...
</body>

<body>
    <home data-page="true">
        ...
        <div class="notification" id="notification_id">...</div>
    </home>
    ...
</body>

Both of these style make this issue. Totally Strange haha.

"Maybe" I bind mapsplugin/cordova-plugin-googlemaps(Ver.2.0) at same page is the reason why this happen, although I did recheck every px are not overlap each other, but I haven't give a shot to set map unclickable and figure out is this the reason of this issue.

phonon-framework / phonon

Custom Notification and Footer Tabs BUG #229