Hello,
I've got a problem when i using UI Tabs and load an external page into the tabcontent-DIV. When the page has loaded, all jQueries for this page seems not to work anymore. I read something about callbacks, but it's not clear at all.
Example: I load an external page by ui-tabs, and the loaded content includes a DIV, that should hide automatically as jQueried in index.html The jQuery click-event is only added to show that a live-event is working. But i can't get the auto-hide working, after loading the content.
index.html
<script type="text/javascript">
jQuery(document).ready(function() {
// define tabs
$('#tabs').tabs();
// after loading external page, the div "autohideafterload" will automatically hide.
$('#autohideafterload').hide('slow');
$('#autohideafterload').live('click', function() {
$('#autohideafterload').hide('slow');
});
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="loadcontent.html" title="tabcontent"><span>Load data</span></a></li>
</ul>
</div>
<div id="tabcontent"></div>
</body>
</html>
loadcontent.html
<div id="autohideafterload">This div will hide automatically after loaded this external page.</div>
What am i missing?