jQuery UI | position() 方法

jQuery UI框架为用户提供了许多实用功能，其中之一是position()方法。 position()方法有助于相对于页面中的任何目标元素定位任何元素，如窗口、任何父元素、文档或鼠标。它根据“顶部”、“左侧”、“右侧”和“底部”等属性描述任何元素的位置。
笔记：

它不支持隐藏元素定位功能。
只有子元素相对于任何其他元素或目标定位。

句法：

$(selector).position( options )

其中options是对象类型，它定义了元素相对于目标或父元素的定位方式。我们将只解释其中一些常用的：
选项：

my：它是字符串类型。此选项提及与父目标元素对齐所需的元素位置。它的默认值是中心。
at：它是字符串类型。此选项提及定位子元素的父目标元素的位置或位置。它的默认值是中心。
of：类型为选择器或父元素。此选项提及要对其定位的父元素或目标元素。它的默认值为null 。
碰撞：它是字符串类型。此选项提及当定位元素超出文档窗口时应用的规则。默认值为翻转。

jQuery UI 的链接：

href=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/ui-lightness/jquery-ui.css” rel=”stylesheet” type=”text/css” />

编程需要懂一点英语

示例 1：在下面的示例中，演示了基本的默认position()方法。 “divID1”和“divID2”固定在它们相对于父元素“mainDivID”的“my”和“at”位置。鼠标事件是为“divID3”处理的。该位置旨在围绕文档移动，在左侧和顶部保持 10 的间隙。

html



 

    
    
    jQuery UI position method
    
    
    
 
    
    

 

    GeeksforGeeks
    jQuery UI position utility 
     
    
        Position 1
        Position 2
        Position 3

html



 

    
    
    jQuery UI position method
    
    
    
 
    
    

 

    GeeksforGeeks
    jQuery UI position method 
     
 
    
         

            This is the parent target element.
        
 
    
 
    
         

            Change my position
        
 
    
 
    
 
        
            Select "my" positions :
            
            
        
        
            Select "at" positions :
            
            
        
        
            Select collision options:

输出：

示例 2：在以下示例中，代码位置方法与上述所有选项或参数一起演示。

html



 

    
    
    jQuery UI position method
    
    
    
 
    
    

 

    GeeksforGeeks
    jQuery UI position method 
     
 
    
         

            This is the parent target element.
        
 
    
 
    
         

            Change my position
        
 
    
 
    
 
        
            Select "my" positions :
            
            
        
        
            Select "at" positions :
            
            
        
        
            Select collision options:

输出：