Example usage for com.google.gwt.query.client.css RGBColor RED

Introduction

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

Prototype

RGBColor RED

To view the source code for com.google.gwt.query.client.css RGBColor RED.

Click Source Link

Usage

From source file:gwtquery.samples.client.AnimationsSample.java

License:Apache License

private void doColorAnimation() {
    $(".foo")/*from   w ww .  j av a 2  s .c om*/
            .queue("colorQueue",
                    lazy().css(CSS.BACKGROUND_COLOR.with(RGBColor.RED)).dequeue("colorQueue").done())
            .delay(500, "colorQueue")
            .queue("colorQueue",
                    lazy().css(CSS.BACKGROUND_COLOR.with(RGBColor.BLACK)).dequeue("colorQueue").done())
            .delay(500, "colorQueue").queue("colorQueue", new Function() {
                @Override
                public void f() {
                    doColorAnimation();
                    $(".foo").dequeue("colorQueue");
                }

                @Override
                public void cancel(Element e) {
                    $(".foo").clearQueue().stop();
                }
            });

}

---

From source file:gwtquery.samples.client.GwtQueryEffectsModule.java

License:Apache License

public void onModuleLoad() {
    $("div > div").css(CSS.COLOR.with(RGBColor.BLUE)).hover(lazy().css(CSS.COLOR.with(RGBColor.RED)).done(),
            lazy().css(CSS.COLOR.with(RGBColor.BLUE)).done());

    $("div.outer > div").css(CSS.POSITION.with(Position.RELATIVE)).dblclick(new Function() {
        public boolean f(Event e) {
            $("div.outer > div").as(Effects.Effects).animate($$("left: '+=100'"), 400, Easing.LINEAR)
                    .animate($$("top: '+=100'"), 400, Easing.LINEAR)
                    .animate($$("left: '-=100'"), 400, Easing.LINEAR)
                    .animate($$("top: '-=100'"), 400, Easing.LINEAR);
            return true;
        }/* w  w w  .ja  va  2s .  com*/
    });
    $(".note").click(lazy().fadeOut().done());
    $(".note").append(" Hello");

    final Effects a = $(".a, .b > div:nth-child(2)").as(Effects.Effects);
    final Effects b = $(".b > div:nth-child(odd)").as(Effects.Effects);

    $("#b0").width(150).css(CSS.FONT_SIZE.with(Length.px(10))).toggle(new Function() {
        public void f(Element e) {
            $("#b0").as(Effects.Effects)
                    .animate(" width: '400', opacity: '0.4', marginLeft: '0.6in', fontSize: '24px'");
        }
    }, new Function() {
        public void f(Element e) {
            $("#b0").as(Effects.Effects)
                    .animate(" width: '150', opacity: '1', marginLeft: '0', fontSize: '10px'");
        }
    });

    $("#b1").toggle(new Function() {
        public void f(Element e) {
            $(".a").toggle();
        }
    }, new Function() {
        public void f(Element e) {
            a.fadeOut();
        }
    }, new Function() {
        public void f(Element e) {
            a.fadeIn();
        }
    }, new Function() {
        public void f(Element e) {
            a.slideUp();
        }
    }, new Function() {
        public void f(Element e) {
            a.slideDown();
        }
    }, new Function() {
        public void f(Element e) {
            a.slideLeft();
        }
    }, new Function() {
        public void f(Element e) {
            a.slideRight();
        }
    }, new Function() {
        public void f(Element e) {
            a.animate("left: '+=300', width: 'hide'");
        }
    }, new Function() {
        public void f(Element e) {
            a.animate("left: '-=300', width: 'show'");
        }
    });

    $("#b2").toggle(new Function() {
        public void f(Element e) {
            b.as(Effects.Effects).clipUp();
        }
    }, new Function() {
        public void f(Element e) {
            b.as(Effects.Effects).clipDown();
        }
    }, new Function() {
        public void f(Element e) {
            b.as(Effects.Effects).clipDisappear();
        }
    }, new Function() {
        public void f(Element e) {
            b.as(Effects.Effects).clipAppear();
        }
    });

}

---

From source file:gwtquery.samples.client.GwtQuerySampleModule.java

License:Apache License

public void onModuleLoad() {
    // Use compiled selectors
    Sample s = GWT.create(Sample.class);

    // Just a simple usage of dom manipulation, events, and lazy usage
    s.allNotes().text("Hello Google I/O").css(CSS.CURSOR.with(Cursor.POINTER))
            .toggle(lazy().css(CSS.COLOR.with(RGBColor.RED)).done(), lazy().css(CSS.COLOR.with(null)).done());
    // Cascade effects
    $("<div id='id' style='font-size: 150%;'>Cascade Efects</div>").appendTo(document).hide().fadeIn(5000)
            .fadeOut(3000);//from w w w  .  j  a v  a 2 s .  c om

    // Widgets
    $(".btn").as(Widgets).button(new WidgetInitializer<Button>() {
        public void initialize(Button button, Element e) {
            final String tag = e.getTagName();
            button.addClickHandler(new ClickHandler() {
                public void onClick(ClickEvent event) {
                    Window.alert("You click on a GWT Button created from a " + tag);
                }
            });
        }
    });
    $(".inputText").as(Widgets).textBox();
    $(".inputPsw").as(Widgets).passwordBox();
    $(".textArea").as(Widgets).textArea();
    $(".label").as(Widgets).label(new WidgetInitializer<Label>() {
        public void initialize(Label label, Element e) {
            label.setText("I'm a gwt label, created from a " + e.getTagName());
        }
    });
}

---