Tuesday, May 20, 2014

GWT browser specific css

Yea it is possible to write browser specific css with GWT application which uses CSS through CssResource.
    @if user.agent gecko1_8 {
    	.startup p {
    		color: #000000;
    		text-shadow: 0 0 3px #000000;
    	}
    } @else {
    	.startup p {
    		color: #000000;
    	}
    } 
 
Note: You can use this logical if else and many more other expression inside css which are used inside GWT code. Only through CssResource interface. If you are directly using the respective css inside html main source file then this will not work.




For more details refer






GWT Jquery integration

It is very easy to have GWT Jquery integration using gwtquery. Follow below steps

Add maven dependency for gwtquery, at the time of writing this article it was 1.4.2 and tested it with GWT 2.5.0 version. 
        <dependency>
            <groupId>com.googlecode.gwtquery</groupId>
            <artifactId>gwtquery</artifactId>
            <version>1.4.2</version>
            <scope>provided</scope>
        </dependency>

Then inherit your module from required gwtquery module.
<inherits name='com.google.gwt.query.Query'/>

User jquery api wrappers as follows.
import static com.google.gwt.query.client.GQuery.$;
..
...
public class GwtJquery implements EntryPoint {

	@Override
	public void onModuleLoad() {
		$("#startup").fadeIn(1000);
		$("#product").delay(2000).fadeIn(1000);
	}
...
...
}

For More details refer getting started