Positioning the element second time using JQuery UI's position does not work as expcted -

यह मेरा बेला है:

HTML:

  & lt; आईएमजी src = "http://cdn.tacky.me/m/static/settings16.png" class = "settings-icon" / & gt; & Lt; div id = "control-panel" & gt; & Lt; img src = "http://cdn.tacky.me/m/static/settings16.png" / & gt; & Lt; a href = "#" शैली = "फ्लोट: राइट" id = "close-cp" & gt; एक्स & lt; / a & gt; & Lt; div class = "link_container" & gt; & lt; a href = "#" & gt; प्रोफाइल दिखाएं & lt; / a & gt; & lt; / div & gt; & Lt; / div & gt;   
 सीएसएस:  
  .settings-icon {मार्जिन: 100px; कर्सर: सूचक; } # नियंत्रण-पैनल {स्थिति: निरपेक्ष; ऊंचाई: ऑटो; चौड़ाई: ऑटो; शीर्ष: 0; बाएं: 0; पृष्ठभूमि रंग: #fff; फ़ॉन्ट-परिवार: एरियल, बिना-सेरिफ़; कुछ भी डिस्प्ले मत करो; Z- सूचकांक: 4; }   
 जावास्क्रिप्ट:  
  $ ('settings-icon')। क्लिक करें (फ़ंक्शन () {$ ('# control-panel')। स्थिति ($: '$ settings-icon'), my: 'left top', at: 'left top'}); $ ('# control-panel')। Show ();}); $ ('# Close-cp')। क्लिक करें (फ़ंक्शन (इवेंट) {event.preventDefault (); $ ('# control-panel')। Hide ();});   
  मैं क्या करने की कोशिश कर रहा हूं:  मेरे पास एक सेटिंग्स छवि है, जिस पर क्लिक करके यह इस आईएमजी के आस-पास एक पूरी तरह से डिज़ाइन किए गए div (contgrol-panel) नाम रखता है  
  मैं क्या देख रहा हूं:   
 पहली बार मैं आईएमजी पर क्लिक करता हूँ यह ठीक काम करता है  
 मैं क्लिक करके नियंत्रण कक्ष को खारिज कर देता हूं  
  Repro कैसे करें   
 जाओ पर क्लिक करें  
  
 पहली बार सेटिंग्स आइकन पर क्लिक करें  
 कंट्रोल पैनल को खारिज कर दें जो एक्स पर क्लिक करके नीचे जाता है  
 क्लिक करें    
 
      P> आपको नियंत्रण कक्ष को 0 से वापस करने की आवश्यकता है, इसे बंद होने के बाद। यहां अपडेट किया गया बेला है।  
  $ ('settings-icon')। क्लिक करें (फ़ंक्शन () {$ ('# control-panel')। स्थिति ({: of $ (this) , My: 'left top', at: 'left top'}); $ ('# control-panel')। Show ();}); $ ('# Close-cp') क्लिक करें (फ़ंक्शन (इवेंट) {event.preventDefault (); $ ('# control-panel')। सीएसएस ({top: '0px', left: '0px'}) छिपाना(); });