jQuery 對話框跳轉到頁面底部

Question

我正在使用 jQuery 為最終用戶（可以在 Chrome 或任何其他瀏覽器上）創建類似於教程/提示的自定義彈出窗口。 但是，如下圖所示，包含我的代碼的 div 有一個很大的頂部，它將我的代碼向下推。 在使用 Chrome 的開發人員工具時，我注意到需要 -591px 才能在我想要的位置彈出窗口，所以我使用了以下代碼：

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> 
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js" />
  <script>
    function myFunction() {

        $(function () {
            $("#something").dialog();
        });

        $("#something").dialog({
            top:-591
        });
    }
    </script>

    <div id="something"  style="resize:both; display:none; background-color:yellow; height: 200px; width:200px;">
  <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed.</p>
</div>

我嘗試了這個鏈接中的幾個答案，但它們沒有用。 另外，我注意到當我注釋掉第一個腳本行 (jquery-2.1.11.min.js) 時它停止工作，所以它可能與那個 jQuery 版本有關？

以下是 Chrome 開發工具的截圖：

Answer 1

問題是你又加了js而不是加CSS

將其更改為jquery-ui.css

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

演示