BPM, Workflow, and Case

BPM, Workflow, and Case

Come for answers. Stay for best practices. All we’re missing is you.

 View Only
  • 1.  Remove gap in iframe panel

    Posted Thu March 10, 2022 11:04 AM
    1. Iframe is created through simple custom HTML placed in an Panel and we made panel as floater using Inline CSS and Click Event. So by default when page loads we have gap in the scroll, Highlighted in yellow on below image. If I remove Iframe, scroll gap will disappears. How to remove that gap with Iframe included.

     

    Inline CSS

     

    .sticky {

      position: fixed;

      top: 0;

      width: 99%;

      z-index:100;

    }

     

    .nonSticky {

                    position: initial;

    }

     

    Event

     

    window.onscroll = function() {setStickyHeader()};

     

    var header=this.ui.get("collapsePanelMC");

    var sticky = header._instance.panel.offsetTop;

    var stickyView = this.context.options.stickyView.get("value");

    header._instance.panelBody.style.display = "none";

     

    function setStickyHeader() {

                    if(stickyView){

                                    if (window.pageYOffset > sticky) {

                                                    header.addClass("sticky","nonSticky");

                                                    header._instance.panelBody.style.display = "none";

                                                    header.setIcon("angle-left");

                                                    header.setTitle("MESSAGE CENTER");

                                    }else {

                                                    header.addClass("nonSticky","sticky");

                                                    header._instance.panelBody.style.display = "none";

                                                    header.setIcon("angle-left");

                                                    header.setTitle("MESSAGE CENTER");

                                    }

                       }

                    }

     

    this.setVisibility = function(){

                    if(this.context.options.display.get("value")){

                                    this.ui.get("collapsePanelMC")._instance.panelBody.style.display = "";

                                    this.ui.get("collapsePanelMC").setIcon("angle-down");

                                    this.context.options.display.set("value", false);

                                    this.ui.get("collapsePanelMC").setTitle("MESSAGE CENTER");

                    }else{

                                    this.ui.get("collapsePanelMC")._instance.panelBody.style.display = "none";

                                    this.ui.get("collapsePanelMC").setIcon("angle-left");

                                    this.context.options.display.set("value", true);

                                    this.ui.get("collapsePanelMC").setTitle("MESSAGE CENTER");

                    }             

    }



    ------------------------------
    Kathy Bazinet
    North America z Sytems DevOps and Digital Transformation Technical Sales Manager
    IBM
    Hartford CT
    860-888-9921
    ------------------------------


  • 2.  RE: Remove gap in iframe panel

    Posted Fri March 11, 2022 03:47 PM
    Hi Kathy,

    Any video or screenshot to show the iframe problem? 

    Also, wouldn't it be more helpful to us to see your iframe codes rather than your sticky header codes as they have nothing to do with the problem?

    Thanks
    Thong Huynh

    ------------------------------
    Thong Huynh
    Sydney NSW
    ------------------------------