どのようにカーソルを設定することができます:GWT:ラベル付きハンド

ユーザーがマウスの上にマウスを置くと、カーソルをHAND_CURSORに変更できるように、マウスのリスナーをLableに設定したいと思います。

 

私はスタイルのCSSを設定しようとした "カーソル:手;"このラベルでは、実行時にすべての属性カーソルが置き換えられました。

提案はありますか?

7
何か他のものが上書きされている場合は、 cursor:pointer!important; を追加してCSSスタイルを強制します。
追加された 著者 Strelok,
あなたはcss "cursor:pointer"を意味しますか?
追加された 著者 Abdullah Battal,
これは、CSS標準で定義されている point hand のようなカーソルがないためです。 Chrisが答えとして示したように、使用する正しい用語は pointer です。有効なCSSカーソル値のリストは、次のURLから参照できます。 w3schools.com/cssref/pr_class_cursor.asp
追加された 著者 Abdullah Battal,
私は "カーソル:点"と "カーソル:手"を試しましたが、それでも置き換えられました
追加された 著者 Jimmy,
StrelokとAbdullahに感謝します。私はcssをcursor:pointer!importantに変更しました。それは働いた。
追加された 著者 Jimmy,

4 答え

user1557828 で提供される答えは、マウスが上に来たときにラベルにカーソルを表示させますが、同じ結果を得るための簡単な方法があります。

Label testLabel = new Label("Text Goes Here);
testLabel.getElement().getStyle().setCursor(Cursor.POINTER); 

これによりインスタンス化時にカーソルが設定され、スタイルは維持されます。マウスがラベル上を移動するたびにスタイルを再適用する必要はありません。

19
追加された

これを行う適切な方法は次のとおりです。

.left_menu_title {
   cursor: pointer;
}

そして


2
追加された
styleName ではなく addStylesNames を使用するべきですが、ここで説明した問題とは関係ありません。ただのFYI。
追加された 著者 Thomas Broyer,
ラベルスタイリングルールを追加しました。あなたはラベルのためにそれを正しく宣言していませんでした。
追加された 著者 Chris Cashwell,
私はカーソルのすべての属性が置き換えられたと言った。 "カーソル:ポイント;" "カーソル:手;"
追加された 著者 Jimmy,
ありがとうございます、私はそれを使用して修正 "カーソル:ポインタ!重要;"
追加された 著者 Jimmy,

次の操作を行うだけです。

.left_menu_title {
 cursor: pointer;
}

カーソルをポインタに設定する以外の方法でコードを実行させる場合は、次のようにします。

import com.google.gwt.dom.client.Style.Cursor;
import com.google.gwt.event.dom.client.MouseOverEvent;
import com.google.gwt.event.dom.client.MouseOverHandler;
import com.google.gwt.user.client.ui.Label;

...
...
...


 final Label testLabel = new Label();
 testLabel.addMouseOverHandler(new MouseOverHandler() {     
        @Override
        public void onMouseOver(MouseOverEvent event) {
             testLabel.getElement().getStyle().setCursor(Cursor.POINTER);   

            //TODO: any thing you want      
        }
    });
2
追加された
where to this one..
Label testLabel = new Label("Text Goes Here);
testLabel.getElement().getStyle().setCursor(Cursor.POINTER); 

in my code provided below..

 {
   xtype:'label',
   text:'testLabel',
   id:'cancel1',
   Label testLabel = new Label("Text Goes Here);  
   testLabel.getElement().getStyle().setCursor(Cursor.POINTER); 
   listeners : {
   render : function(d) {
   d.getEl().on('click', function(){ this.fireEvent('click', d); }, d);
}
}

}
2
追加された
私は私のコードでこれを試してみましたが、それは私のコードに入れて適切な答えを与えるPLZは動作していません...
追加された 著者 krupal,