I'm using the Liquid Slider with ajax and i have a problem with height.
this is my script:
var api2 = $.data( $('#slider-7')[0], 'liquidSlider'); $.ajax({ complete: function() { $('#siteloader').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work1.html'); $('#siteloader2').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work2.html'); $('#siteloader3').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work3.html'); $('#siteloader4').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work4.html'); api2.adjustHeight(true, api2.getHeight()); } });
The pages are loaded in the div but adjustHeight doesn't work correctly...where is the problem?
Thank's
That way, simply add this script to your ajax complete function:
var innerHeight = $('#innerElement').height();
look that JSFIDDLE EXAMPLE
So... you can use this code like this:
$.ajax({
complete: function() {
$('#siteloader').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work1.html');
$('#siteloader2').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work2.html');
$('#siteloader3').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work3.html');
$('#siteloader4').html('This JSON request was faked, and you will surely want to write a real one in it\'s place' + $('.profile').html()).load('work4.html');
api2.adjustHeight(true, $(api2).height());
}
});
Hope this help.
problem solved for me:
<pre>
$.ajax({
complete: function() {
$('#siteloader').html('<div#siteloader>This JSON request was faked, and you will surely want to write a real one in it\'s place</div>' + $('.profile').html()).load('work1.html');
$('#siteloader2').html('<div#siteloader>This JSON request was faked, and you will surely want to write a real one in it\'s place</div>' + $('.profile').html()).load('work2.html');
$('#siteloader3').html('<div#siteloader>This JSON request was faked, and you will surely want to write a real one in it\'s place</div>' + $('.profile').html()).load('work3.html');
$('#siteloader4').html('<div#siteloader>This JSON request was faked, and you will surely want to write a real one in it\'s place</div>' + $('.profile').html()).load('work4.html');
setTimeout(function() {
var api2 = $.data( $('#slider-7')[0], 'liquidSlider');
if($().liquidSlider) {
api2.adjustHeight(true, api2.getHeight());
}
}, 200);
}
});
</pre>
I check if liquid slider function exists in setTimeout(function() and "api2.adjustHeight(true, api2.getHeight());" works.
Thanks, everyone!