0

VAADIN アプリケーションのカスタム テーマが /kopiMapReportGeneration/WebContent/VAADIN/themes にあり、style.css の進行状況インジケーターを変更したい:

.v-loading-indicator, .v-loading-indicator-delay, .v-loading-indicator-wait {
   width: 100%;
   height: 100%;
   margin: 0;
   background-position: 50%;
   background-image: url("../customThemes/img/progress.gif");
   background-color: gray;
   opacity: .8;
   -ms-filter: alpha(opacity=80);
   filter: alpha(opacity=80);
   background-repeat: no-repeat; 
   background-attachment: fixed; 
}

これが画像のパス/WebContent/VAADIN/themes/customThemes/img/progress.gif です。問題は、css の変更が考慮されていないことです。

4

1 に答える 1

4

いくつかのポイントがあります：

  1. style.cssはキャッシュされるため、css を変更した後は、ブラウザのキャッシュをクリアして新しいstyle.cssリソースを取得する必要があります。
  2. あなたのアプリケーションとメインウィンドウはsetTheme("customThemes");
  3. background-image: url("img/progress.gif");で十分ですが、background-image: url("../customThemes/img/progress.gif");うまくいくはずです。

修正:

  1. 要素の検査を介して、HTMLページで要素を検索<link rel="stylesheet" type="text/css" href="/context-if-any/VAADIN/themes/customThemes/styles.css">しますHEAD。そこにあるはずです。
  2. css リソースにアクセスし、それが最新であり、キャッシュされていないことを確認します
  3. /context-if-any/VAADIN/themes/customThemes/img/progress.gifリソースが Web ブラウザ経由でアクセスできることを確認してください

結論:

1を修正すると、他のテーマがリンクされます。-> アプリケーションで setTheme() メソッドを試してください

2 を修正すると、css リソースがキャッシュされます。ctrl + F5 を押してハード リフレッシュするか、ブラウザのキャッシュをクリアします。

修正 3 がうまくいかない場合、カスタム テーマは使用できません。リソースを最終戦争にパッケージ化していることを確認してください。

于 2013-08-22T09:46:03.293 に答える