javascript - Using $.get, need to initialize variables on a hidden page -

i have following lines of code bring page has multiple pages loads can brought clicking on tabs:

<script type="text/javascript">  $(document).ready(function() {      //default action     $(".tab_content").hide(); //hide content     $("ul.tabs li:first").addclass("active").show(); //activate first tab     $(".tab_content:first").show(); //show first tab content      //on click event     $("ul.tabs li").click(function() {         $("ul.tabs li").removeclass("active"); //remove "active" class         $(this).addclass("active"); //add "active" class selected tab         $(".tab_content").hide(); //hide tab content         var activetab = $(this).find("a").attr("href"); //find rel attribute value identify active tab + content         $(activetab).fadein(); //fade in active content         return false;     });  });  </script>  ...  <div id="tabbararea">     <div id="tabbarcontainer">         <ul class="tabs">             <li id="home"><a href="#home">home</a></li> -->             <li id="readinglisttab"><a href="#books">commander's reading list</a></li>             <li id="moviestab"><a href="#movies">lecture series</a></li>         </ul>     </div> </div> <div class="container">     <div id="tab_container">         <div id="home" class="tab_content">             <div id="homeheadergraphic" class="header">                 <img id="homeheadergraphicimage" src="images/commandprofessionaldeveloment%20resourceguide%20header-title.png">             </div>             <div id="homecontent" class="contentarea">                 <script type="text/javascript">                     $.get("home.html", function(data){                         $("#homecontent").empty().append(data);                      }, "html");                     resizecontentareaheight("home", "homeheadergraphic", "homecontent");                 </script>             </div>         </div>         <div id="books" class="tab_content">             <div id="booksheadergraphic" class="header">                 <img id="booksheadergraphicimage" src="images/commander%27sreadinglist%20header.png">             </div>             <div id="bookscontent" class="contentarea">                 <script type="text/javascript">                     $.get("commanderreadinglist.html", function(data){                         $("#bookscontent").empty().append(data);                      }, "html");                     resizecontentareaheight("books", "booksheadergraphic", "bookscontent");                 </script>             </div>         </div>         <div id="movies" class="tab_content">             <div id="moviesheadergraphic" class="header">                 <img id="moviesheadergraphicimage" src="images/lectureseries%20logo.png">             </div>             <div id="moviescontent" class="contentarea">                 <script type="text/javascript">                     $.get("forumsarchives.htm", function(data, status, xhr){                         $("#moviescontent").empty().append(data);                      }, "html");                     resizecontentareaheight("movies", "moviesheadergraphic", "moviescontent");                 </script>             </div>         </div>     </div> </div> 

the problem have when comes bringing reading list, needs variables on page initialized, though hidden. variables should values:

truelittlebooksresponsiveoffsettop: 363  $('#readinglistintro').offset().top: 263  $('#readinglistintro').css('margin-top'): 0  $('#readinglistintro').height(): 100  littlebooksresponsivetop: 365  littlebooksresponsiveheight: 0  bookmenubarheighttomove: 161  readinglistintrotop: 263  readinglistintroheight: 100 

but comes when home tab first thing come up.

truelittlebooksresponsiveoffsettop: 0 $('#readinglistintro').offset().top: 0 $('#readinglistintro').css('margin-top'): 0px $('#readinglistintro').height(): 0 littlebooksresponsivetop: 0 littlebooksresponsiveheight: 0 bookmenubarheighttomove: -204 readinglistintrotop: 0 readinglistintroheight: 0 

as can tell, problem second tab not visible during page start up. when make books tab first 1 visible, initializes correctly, yet when use home page first tab, gives me bad variables. need variables page not visible initialize.

you may use, calculation, either of set of following css make page visible , calculate stuff , revert back:

position: absolute; z-index: 1; top: -200%; 

or else:

display: block; position: absolute; z-index: 1; visibility: hidden; 

the above css has set inside success function of ajax event.