Example usage for com.google.gwt.query.client.css CSS OVERFLOW

Introduction

In this page you can find the example usage for com.google.gwt.query.client.css CSS OVERFLOW.

Prototype

OverflowProperty OVERFLOW

To view the source code for com.google.gwt.query.client.css CSS OVERFLOW.

Click Source Link

Document

The overflow property specifies whether the content of a block-level element is clipped when it overflows the element's box (which is acting as a containing block for the content).

Usage

From source file:com.pronoiahealth.olhie.client.pages.AbstractPage.java

License:Open Source License

/**
 * Add full page scrolling. This can only be done before the page is loaded.
 * /* ww  w  .j  av  a2s .  com*/
 * @param fullPageScrollingActive
 */
protected void addFullPageScrolling() {
    // Activate full page scrolling
    // Get the root div
    final GQuery gObj = AppSelectors.INSTANCE.getCenterBackground();

    // Called when scrolling stops
    // Timer set in scroll event
    // Address weird Chrome/Safari (Webkit) issue
    // Just asking for some data from the element emitting
    // scroll events seems to refresh the display and
    // help fix the issue
    scrollStopTimer = new Timer() {
        @Override
        public void run() {
            int scrollTop = gObj.scrollTop();
            // gObj.scrollTop(scrollTop + 3);
            // gObj.scrollTop(scrollTop);
        }
    };

    // Make sure its overflow is set to auto
    gObj.css(CSS.OVERFLOW.with(Overflow.AUTO));

    // State of scroll link
    gObj.data("scrollLinkActive", Boolean.FALSE);

    // Create the scroll link
    scrollLink = $("<a href=\"#\" class=\"ph-BulletinBoard-Scrollup\">Scroll</a>");

    final Function fadeIn = new Function() {
        @Override
        public void f(Element e) {
            scrollLink.css(Properties.create("opacity: 1.0;"));
            // super.f(e);
        }
    };

    final Function fadeOut = new Function() {
        @Override
        public void f(Element e) {
            scrollLink.css(Properties.create("opacity: 0.0;"));
            // super.f(e);
        }
    };

    // Append the link to the root div
    gObj.append(scrollLink);

    // Bind the scroll event
    gObj.bind(Event.ONSCROLL, new Function() {
        @Override
        public boolean f(Event e) {
            // GQuery rootDiv = $(e);
            // int scrollTop = rootDiv.scrollTop();
            // Set timer
            scrollStopTimer.cancel();
            scrollStopTimer.schedule(500);

            // Test scroll top
            int scrollTop = gObj.scrollTop();
            boolean scrollLinkActive = (Boolean) gObj.data("scrollLinkActive");
            if (scrollTop >= 100 && scrollLinkActive == false) {
                gObj.data("scrollLinkActive", Boolean.TRUE);
                scrollLink.fadeIn(500, fadeIn);
            } else if (scrollTop < 100 && scrollLinkActive == true) {
                gObj.data("scrollLinkActive", Boolean.FALSE);
                scrollLink.fadeOut(500, fadeOut);
            }

            // return super.f(e);
            return false;
        }
    });

    // Bind to the scrollup link
    scrollLink.bind(Event.ONCLICK, new Function() {
        @Override
        public boolean f(Event e) {
            gObj.animate("scrollTop: 0", 500, (Function) null);
            scrollLink.hide();
            return false;
        }
    });

    this.fullPageScrollingActive = true;
}

---

From source file:com.pronoiahealth.olhie.client.widgets.scrolldiv.ScrollDiv.java

License:Open Source License

@PostConstruct
protected void postConstruct() {
    // Activate full page scrolling
    // Get the root div
    final GQuery gObj = $(root);

    // Make sure its overflow is set to auto
    gObj.css(CSS.OVERFLOW.with(Overflow.AUTO));

    // Create the scroll link
    scrollLink = $("<a href=\"#\" class=\"ph-BulletinBoard-Scrollup\">Scroll</a>");

    // Append the link to the root div
    gObj.append(scrollLink);//w ww.  ja  v a2s .c  o m

    // Bind the scroll event
    gObj.bind(Event.ONSCROLL, new Function() {
        @Override
        public boolean f(Event e) {
            GQuery rootDiv = $(e);
            int scrollTop = rootDiv.scrollTop();
            if (scrollTop > 100) {
                scrollLink.fadeIn(500, new Function() {
                    @Override
                    public void f(com.google.gwt.dom.client.Element e) {
                        $(e).css(Properties.create("opacity: 1.0;"));
                        // super.f(e);
                    }
                });
            } else {
                scrollLink.fadeOut(500, new Function() {
                    @Override
                    public void f(com.google.gwt.dom.client.Element e) {
                        $(e).css(Properties.create("opacity: 0.0;"));
                        // super.f(e);
                    }
                });
            }
            return super.f(e);
        }
    });

    // Bind to the scrollup link
    scrollLink.bind(Event.ONCLICK, new Function() {
        @Override
        public boolean f(Event e) {
            gObj.animate("scrollTop: 0", 500, (Function) null);
            return false;
        }
    });
}

---