Hello again,
This is kinda a continuation on my thred about load in content from a external page to a div depending on choice in a select-box.
(
http://www.codingforums.com/showthread.php?t=284405)
I use this code to load in content:
Code:
$(document).ready(function(){
$("#select_box").change(function(){
var selectedOption = $('#select_box :selected').val();
$containerDiv = $('#div_where_content_loads_in');
switch (selectedOption)
{
case "Option1":$containerDiv.load( "page.html#div1" ); break;
case "Option2":$containerDiv.load( "page.html#div2" ); break;
case "Option3":$containerDiv.load( "page.html#div3" ); break;
case "Option4":$containerDiv.load( "page.html#div4" ); break;
}
});
});
Problem:
When this code tries to load in a div containing a ui-slider element the graphics dont show up.
The slider is there but its hidden becuse if I place one slider in the page from pageload/start (visible) and one slider in the div that gets loaded (invisible), then give them same ID so the slide handle-bars move at the same time (when only moving one), in the exaxtly moment of moving the visible slider the invisible slider shows up.
Its feels like it dont have any CSS rules when loaded in and then it gets the same rules at the other slider when its have to work.
Have anybody here experienced anything similar before?
Sorry for some incorrect english.