[解決済み] グレーの透明な背景を設定する
2022-02-05 06:47:33
質問
ハローフレンド 処理画像を表示するコードがあるのですが、背景の色が変わってしまうので、グレーに変更する必要があります。
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript">
// Get the instance of PageRequestManager.
var prm = Sys.WebForms.PageRequestManager.getInstance();
// Add initializeRequest and endRequest
prm.add_initializeRequest(prm_InitializeRequest);
prm.add_endRequest(prm_EndRequest);
// Called when async postback begins
function prm_InitializeRequest(sender, args) {
// get the divImage and set it to visible
var panelProg = $get('divImage');
panelProg.style.display = '';
// reset label text
var lbl = $get('<%= this.lblText.ClientID %>');
lbl.innerHTML = '';
// Disable button that caused a postback
$get(args._postBackElement.id).disabled = true;
}
// Called when async postback ends
function prm_EndRequest(sender, args) {
// get the divImage and hide it again
var panelProg = $get('divImage');
panelProg.style.display = 'none';
// Enable button that caused a postback
$get(sender._postBackSettings.sourceElement.id).disabled = false;
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="lblText" runat="server" Text=""></asp:Label>
<div id="divImage" style="display:none" class="divCentro">
<div class="FondoGris">
<asp:Image ID="img1" runat="server" ImageUrl="~/Procesando2.gif"/>
</div>
<br />
<p class="divCentro"><br /><br /><br />Processing...</p>
</div>
<br />
<asp:Button ID="btnInvoke" runat="server" Text="Click"
onclick="btnInvoke_Click" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
そして、以下がCSSのコードです。
<style type="text/css">
.divCentro {
text-align:center;
width: 327px; height: 60px; margin-top: -23px; margin-left: -158px; left: 50%; top: 40%; position: absolute;
}
</style>
background-color: gray transparent と書いてみましたが、divの画像の色が変わるだけです。
もし、どなたかご提案がありましたら、よろしくお願いします。
ありがとうございました。
どのように解決するのですか?
これを試してみてください。
<div class="divOuterCentro">
<p class="divCentro"><br /><br /><br />Processing...</p>
</div>
CSSです。
.divOuterCentro{
height:100%;
width:100%;
background-color:rgba(0,0,0,0.4);
position:absolute;
}
.divCentro {
text-align:center;
width: 327px;
height: 60px;
margin-top: -23px;
margin-left: -158px;
left: 50%;
top: 40%;
position: absolute;
}
ワーキングフィドル... リンクはこちら
関連
-
[解決済み] リンクにアニメーションGIFを表示し、ホバーとリセットで再生する方法
-
[解決済み] :first-child が期待通りに動作しない
-
[解決済み] select2入力の幅を設定する(Angular-uiディレクティブを使用)
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] 同じ要素にbackground-imageとCSS3グラデーションを組み合わせるにはどうすればよいですか?
-
[解決済み] フレックスボックスのアイテム間の距離を設定するためのより良い方法
-
[解決済み] CSS画像を背景で伸縮させる - CSSのみで可能
-
[解決済み] CSS背景のストレッチとスケール
-
[解決済み] CSSで背景画像にサイズを設定する?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】Google Chromeでレスポンシブメディアクエリが機能しない件
-
[解決済み] リンクにアニメーションGIFを表示し、ホバーとリセットで再生する方法
-
[解決済み] margin: auto は中央揃えではありません。
-
[解決済み] Railsです。railsでcssから背景画像を設定する方法は?
-
[解決済み] CSSを使用します。ウィンドウの幅の50%の背景色を設定する
-
[解決済み] svgの円のダブルストロークの色
-
[解決済み] CSSでitempropをターゲットにする?
-
[解決済み] three.jsの背景を透明や他の色に変更する。
-
[解決済み] select2入力の幅を設定する(Angular-uiディレクティブを使用)
-
[解決済み] Atomエディタで透明な背景を設定する方法は?