0

ユーザーが「新しいパスワード」テキスト ボックスに class を入力するたびに jquery ポップアップが表示されるパスワード リセット ページがここid="pswd_info"にあります。

問題は、ポップアップがテキストボックスを覆っていることです。現在、他の解決策がないページの下部に固定しています。以下に示すように、ブラウザーのサイズが縮小する場合、これは適切ではありません。

PWUpdate画面イメージ

ポップアップを下に移動する、または「新しいパスワード」テキストボックスを上に移動するには、どのような手法を検討する必要がありますか?

4

2 に答える 2

1

このcssを使用しています：

right: 360px;

これにより、ポップアップがページの右端から 360 ピクセルの位置に配置されます。ほとんどのユーザーはさまざまな画面幅を持っているため、これは問題になります。(ブラウザのウィンドウのサイズを変更してみてください)

より一般的なセンタリング方法を使用するには、次を使用します。

right:50%;
margin-right:-125px;

これで真ん中に配置されます。margin-right は、要素自体の幅を補うために、ポップアップの全幅の半分です。

下のプロパティでも同じ問題が発生するため、下の代わりに上を使用することをお勧めします。(さらに、2 つの異なるボトム プロパティがあり、1 つは欠陥があります)

于 2012-07-31T15:44:49.237 に答える
0

パスワード入力フィールドと同じ li 要素にポップアップを移動します。

<li style="position: relative;">
    <label for="pswd">New Password:</label>
    <span>
        <input id="MainContent_pswd" type="password" autocomplete="off" name="ctl00$MainContent$pswd">
    </span>
    <div id="pswd_info">place your password info box content here...</div>
</li>

ただし、li 要素で "position: relative" を設定する必要があります (クラスを介して、または上記の例のように)

少なくとも、「bottom: (次の相対的な親までの底の距離)px;」を設定する必要があります。財産 ：）

于 2012-07-31T15:42:05.207 に答える