0

要素（パネル）を見つけて位置を取得し、ページをその位置にスクロールするjavascriptがあります。ボタンのクリック時に JavaScript 関数が呼び出されます。パネルが Visible=true の場合、すべて正常に動作します。ただし、ページの読み込み時には、パネルがユーザーに表示されないようにする必要があります。パネルが Visible = false の場合、ページにパネルが存在しないため、javascript 関数は機能しません。パネルが style="display:none" の場合、存在し、ユーザーには表示されませんが、その位置は実際の位置ではありません。パネルが style="visibility:hidden" の場合、パネルは存在し、実際の位置にありますが、パネルが隠されているページに大きな空白があります。

ページに空白スペースがないとパネルがユーザーに見えないようにし、ページ上の実際の位置を取得するにはどうすればよいですか?

編集: 私のソリューション + コード -

まあ、私はそれを機能させましたが、より良い解決策があるはずです。ここにコードがあります

<script type="text/javascript">
        function elementPosition(obj) {            
            var curleft = 0, curtop = 0;
            if (obj.offsetParent) {
                curleft = obj.offsetLeft;
                curtop = obj.offsetTop;

                while (obj = obj.offsetParent) {
                    curleft += obj.offsetLeft;
                    curtop += obj.offsetTop;
                }
            }
            return { x: curleft, y: curtop };
        }

        function ScrollToControl(id) {
            jid = id;
            var elem = document.getElementById(jid);
//here I set the display = 'block', and I also set this in button_click event
//when I didn't set it also in button_click event, I get the right panel position
//but the panel remains invisible
            elem.style.display= 'block'; 
            var scrollPos = elementPosition(elem).y;
            window.scroll(0, scrollPos);
            }
           </script>

ページ上のボタン:

<asp:Button ID="btnClientDossiers_EMAIL" runat="server" CssClass="button" Enabled="False"
                            Text="EMAIL" OnClick="btnClientDossiers_EMAIL_Click" />

コードビハインド

 Page_Load
    {
 //how can I dynamically get the ctl00_ContentPlaceHolder?
// Or will the client name of plEMAIL always start with ctl00_ContentPlaceHolder?
    btnClientDossiers_EMAIL.Attributes.Add("onclick", " return 
    ScrollToControl('ctl00_ContentPlaceHolder_plEMAIL');");
    }

    protected void btnClientDossiers_EMAIL_Click(object sender, EventArgs e)
            {
                plEMAIL.Attributes.Add("style", "display:block");
            }
4

1 に答える 1

0

より役立つ回答を提供できるようにコードを投稿してください。ただし、目的を達成できる方法を 1 つ提案します。div(s) を に設定してページを読み込んでからstyle="visibility:hidden;"、垂直位置を要素のグローバル変数またはデータ属性に取得し、すぐに div のスタイルを に設定してstyle="display:none;"ください。

その後、スクロール機能でこれらの位置の値を使用できるようになります。

于 2012-08-06T10:25:39.660 に答える