Getting draggable layer to return to original position after reopen

Getting draggable layer to return to original position after reopen

All,

This is my first post to this forum. I am very glad that this exists.

Notwithstanding, I am pretty new to jQuery and am currently baffled as to how to get a draggable layer to return to its original position after it is closed. Currently, when I close my layer and then reopen it, it appears in its final resting place after the drag rather than appearing in its initial opening spot as set down by CSS class that I have applied to it.

The current solution that I thought might work (see below) is not working as in the layer is still draggable and I can open and close it, but the layer still appears in the spot that it was last dragged to after I close it and then reopen it.

If anyone has an idea as to how I might solve this, I would appreciate the insights and code example. Thank you. Take care.

Dave Nolan

/* Positioning class for layer */
.popin { background-color: rgba(0, 0, 0, 0.5); padding: 16px 16px 16px 16px; width:556px; position:absolute; top:50px; left: 150px; z-index:999}

<script type="text/javascript" src="../scripts/libs/jquery-1.6.4.min.js"></script>
 <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
var originalTop = $('#popin-layer').position().top;
var originalLeft = $('#popin-layer').position().left;


    $('#openLayer').click(function() {
      $('#popin-layer').show();
$('#popin-layer').delay(500).focus();
$('#popin-layer').position().top = originalTop;
    $('#popin-layer').position().left= originalLeft;
    });

    $('#closeLayer').click(function() {
      $('#popin-layer').hide();
$('#openLayer').delay(500).focus();
    });

});

$(document).ready(function() {
    $(function(){
        $('#popin-layer').draggable();
    });
});           
</script>