Home/ Questions/Q 7444193
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-29T11:27:41+00:00

$(.div1).hide(); $(.div2).offset( $(.div1).offset() ).slideDown(); offset() seems to return the current cordinates of an element

  • 0
$(".div1").hide();
$(".div2").offset( $(".div1").offset() ).slideDown();

offset() seems to return the current cordinates of an element RELATIVE to the document. Fine. But when I try to use offset(value) to SET the cordinates of an element, it does it relative to the current position of the element, not the document.

In the example code, I tried to place div2 at the same position of div1.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html> 

<style>

div{margin-bottom: 2px; height: 70px}
.red{background-color: red}
.blue{background-color: blue}
.green{background-color: green}
.orange{background-color: orange}
.pink{background-color: pink}

.msg{background-color: skyblue; border: 1px solid black; border-radius: 5px; display: none}
</style>

<script type="text/javascript" src="/scripts/jquery-1.6.2.min.js"></script>
<script>
$(function(){   
    $(".msg").offset( $(".blue").offset() ).slideDown(); 

});
</script>

<body>

<div class="red"></div>
<div class="blue"></div>
<div class="green"></div>
<div class="orange"></div>
<div class="pink"></div>

<div class="msg">
    TEST
</div>

</body>

</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is because you are first hiding .div1, thereby making it’s offset inaccessible. Change your code around as below and it will work:

    $(".div2").offset( $(".div1").offset() ).slideDown();
$(".div1").hide();

    I’ve tested this works in jsFiddle, but can’t link to it at the moment as they’re changing their hosting.

    • 0