Where to put js action files and css files for extern loaded pages by UI Tabs
I've got an index page including two (actually) tabs, each loading on turn extern1.html and extern2.html
Each tab is defined as <class="u-tabs-hide">i
Each of these two external pages need its own js action script (using jQuery) and css file..
(Note : They can also be tested in stand alone debug condition with php loadind condition <if ($localDebug)>).
Actually :
JQuery and JQueryUI libraries are loaded in the index page
Functions for the extern loaded pages are loaded in the index page
Each page loads its own css and js handlers script.
Event handlers and JQuery UI Dialog constructors are called in the action script in a $(document).ready(function () (The latter does not work if loaded in the $(document).ready(function () of the index page)
Everything works fine on first load of extern1.html (all hanlers are ok) and then of extern2.html
Coming back to the first tab :
- handlers don't work.(they are reloaded at each time)
- as far as I can see the css files are not reloaded (Firebug in Firefox)
- the tab is displayed, then flash hidden, and displayed again.
Where should I put my css and js files ?
$(document).ready(function() looks necessary when debugging the external page as stand alone.
But in normal tabs function perhaps it should be replaced by something as $('#idTab').tabsload(function () ?
Many thanks
PS I looked at http://stackoverflow.com/questions/2146356/where-to-put-jquery-actions-for-extern-loaded-pages-by-ui-tabs but could not answer correctly to my questions with these answers.