jQuery position works on Localhost Cassini, jsFiddle, but always return 0 when IIS or IIS express

Question

I have a table which each row contain a time. The table should show the closest time of the day on top. For example, if the current time is 12:03 the first row on the table should be 12:00. Basically the table auto scroll depending on the time of the day.

I have a code that works fine when running in Visual Studio development environment (Cassini). The code also works in jsFiddle here, but when I install the code in the server or run it with IIS Express, the position always return 0. I do not understand why the jquery position doesn't work or return 0 when IIS or IIS express is used.

Below is the jquery code:

$(document).ready(function () {

var tableID = $('.dcBooking')[0].id; //get the id of table.
var layerID = $('#' + tableID).parent().closest('div').attr('id'); //get the id of the div created by .Net

var currentdate = new Date();
var hour = currentdate.getHours();

var min = currentdate.getMinutes();
var mod = min % 10;
min = (min - mod); //Rounded to the closest previous 10 minutes

var id = getID(hour, min);
var timeTag = $('#' + id);

$('#' + layerID).animate({ scrollTop: timeTag.position().top }, 'slow');
});

Example of HTML:

<div id="id1" style="overflow-x:visible;overflow-y:scroll;height:350px;position:relative;">
<table class="dcBooking">           
<tr id="h08_00_0"><td>08:00</td><td>Joe</td></tr>
<tr id="h12_10_0"><td>12:10</td><td>John</td></tr>
              :
              :
<tr id="h17_00_0"><td>07_00</td><td>Anna</td></tr>
</table>
</div>

I have run out of ideas why the code return a position when run in Cassini or jsFiddle, but it doesn't when installed on the server or run in IIS express. I thought about security issue, but it runs on my computer with Cassini, but not with IIS express, so I think must be some IIS set-up, but I don't know where to look in IIS. Can anyone point me out what or where to look or have an idea what could be the reason of the problem?

score 0 · Answer 1 · answered May 10 '13 at 08:23

I still do not know what is causing the problem, but I was able to make it work by adding a delay to the javascript. I thought that maybe waiting for load instead of document ready would be the solution, but it still did not work with $(window).load(). I added a delay of 300 milliseconds and the position is returning a value other than zero. In case somebody has a similar issue, here is what I did to make it work.

$(document).ready(function () {
   setTimeout("setScrolling()", 300);

});

function setScrolling() {

    var currentdate = new Date();
    var hour = currentdate.getHours();

    var min = currentdate.getMinutes();
    var mod = min % 10;
    min = (min - mod); //Rounded to the closest previous 10 minutes

    var id = 'h' + hour + "_" + min;
    var timeTag = $('#' + id);


     $('#id1').animate({ scrollTop: timeTag.position().top }, 'slow');

 }

jQuery position works on Localhost Cassini, jsFiddle, but always return 0 when IIS or IIS express

1 Answers1