0

最初はこのように見えるWebページがあります。

ここに画像の説明を入力

リンクをクリックすると、ページの右側に小さなフォームが表示されます。

ここに画像の説明を入力

ここに画像の説明を入力

問題は、 Record addedを読み取る行も途中に移動する場合です。

これらは、それらを配置するために私が書いた CSS ルールです。

#frmAddService { float:right; padding-right:250px; padding-top:150px; }   //the form

#msg { float:right; padding-right:250px; padding-top:300px; }   //the 'Record Added' line

フォームが表示されたときにその行の位置を固定するにはどうすればよいですか?

ありがとうございました。

4

1 に答える 1

1

リンクをありがとう、それは助けになります:)

新しい div を作成し、フォームとメッセージを追加します。そうすれば、一方が動くと両方が動きます。そしてid、formContainerを入れました。

ここにCSSがあります

#formContainer{width:350px; float:right;padding-right:250px;}
#frmAddService {position: relative; float:right;padding-top:300px;}

#msg { position:relative; float:right; padding-top:300px; }

#tasks { float:left; padding-left:40px; padding-top:100px; }​

また、#msg の値を変更するために Jquery を変更します

$(function()
{
    $("#frmAddService").hide();

    $("#add").click(function()
    {
        $("#frmAddService").fadeIn("slow");
        $("#msg").css("padding-top","0px");
        $("#msg").css("margin-top","10px");
        $("#msg").css("padding-right","100px");
        return false;
    });
});

http://jsfiddle.net/PJVu6/29/でわかるように、これはほとんどの場合、正常に動作します。

​
于 2012-09-22T13:21:36.340 に答える