superscral
superscral

Reputation: 480

jQuery to GWT - increase and decrease font-size in a whole page

I have one script which reduce and increase the font size of a body content in an HTML page.

I want to do the same things but in a GWT java project.

Here the jQuery code:

            $('#agrandir').click(function () {
                    $('body').stop().animate({fontSize: '+=1px'},300);
            });
            $('#diminuer').click(function () {
                    $('body').stop().animate({fontSize: '-=1px'},300);
            });

HTML code:

      <button id="diminuer">-</button>&nbsp;<button id="agrandir">+</button><br/>

Do you know if it's possible to do the same things in GWT?

Thanks.

Upvotes: 0

Views: 499

Answers (2)

jdramaix
jdramaix

Reputation: 1104

Indeed, you can port any jquery code in GWT by using GwtQuery

import static com.google.gwt.query.client.GQuery.$;
import static com.google.gwt.query.client.GQuery.body;
//...

$("#agrandir").click(new Function () {
      public void f(){
          $(body).stop().animate("{fontSize: '+=1px'}",300);
       }
});
$("#diminuer").click(new Function () {
      public void f(){
           $(body).stop().animate("{fontSize: '-=1px'}",300);
       }
});

You have just to ensure that the element 9with ids 'agrandir' and 'diminuer') are attached to the dom when you query them

Upvotes: 0

Stefan
Stefan

Reputation: 14863

Yes, with gwtquery

Introduction

GwtQuery a.k.a. GQuery is a jQuery-like API written in GWT, which allows GWT to be used in progressive enhancement scenarios where perhaps GWT widgets are too heavyweight. It can also be used to find and improve your GWT widgets.

GwtQuery is easy to learn for those using jQuery as they share the same api, aditionally gquery adds nice features like type-safe css, compile time optimisations, etc.

Currently, almost the jQuery API is written and all CSS3 selectors should be supported. If you found anything unsupported or not implemented yet, please open an issue.

Upvotes: 2

Related Questions