对齐工具提示对话框顶部

align tooltipdialog top

本文关键字:顶部 对话框 工具提示 对齐      更新时间:2023-09-26

>我正在使用以下代码使用 Dojo 来具有工具提示对话框,使用此代码对话框在文本框下方可见,但我想在上面的文本框中看到。

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
     <script language="JavaScript" src="dojo/dojoroot/dojo/dojo.js" type="text/javascript">    
        </script>
         <script language="JavaScript" src="dojo/dojoroot/dijit/TooltipDialog.js" type="text/javascript" >    
        </script>
<link rel="stylesheet" href="dojo/dojoroot/dijit/themes/claro/claro.css" />
        <script>
         dojo.require("dijit.TooltipDialog");
dojo.ready(function(){
    var myTooltipDialog = new dijit.TooltipDialog({
        id: 'myTooltipDialog',
        style: "width: 100px;",
        content: "<p>Nitin.",
        onMouseLeave: function(){
            dijit.popup.close(myTooltipDialog);
        }
    });
    dojo.connect(dojo.byId('thenode'), 'onmousedown', function(){ dijit.popup.open({popup: myTooltipDialog, around: dojo.byId('thenode')}) ;});
});
        </script>

    </head>
    <body class="claro">
<br/>
<br/>
 <input type="text" id="thenode"/>

    </body>
</html>

请给我一些解决方案..

在dijit.popup.open function的参数对象中指定"orient"属性。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<script src="./dojo-release-1.7.3-src/dojo/dojo.js"></script>
<link rel="stylesheet" href="./dojo-release-1.7.3-src/dijit/themes/claro/claro.css" />
<script>
  require([ "dojo/ready", "dijit/TooltipDialog" ], function(ready, TooltopDialog) {
    ready(function(){
      var myTooltipDialog = new TooltopDialog({
        id : 'myTooltipDialog',
        style : "width: 100px;",
        content : "<p>Nitin.</p>",
        onMouseLeave : function() {
          dijit.popup.close(myTooltipDialog);
        }
      });
      dojo.connect(dojo.byId('thenode'), 'onmousedown', function() {
        dijit.popup.open({
          popup : myTooltipDialog,
          around : dojo.byId('thenode'),
          orient: ['above']
        });
      });
    });
  });
</script>
</head>
<body class="claro">
  <br />
  <br />
  <br />
  <br />
  <input type="text" id="thenode" />
  <br />
  <br />
  <br />
  <br />
</body>
</html>

Dojo/dijit/popup.js:252 在 Dojo 1.7.3 版本中。

orient = args.orient || ["below", "below-alt", "above", "above-alt"],