我已经被困2天了,我无法找到解决方案。
我的发展环境:
Cordova 3.4.0-0.1.0,jQuery v1.10.2,BxSlider v4.1.1和Android
当我选择一个类别时,我进行ajax调用并从服务器加载我的bxslider
我的代码:前面
$('.background_folder').on("change", function(){
var folder = $(this).val();
if(folder != '' && folder != undefined){
var jqxhr = $.ajax({
url:'http://myserver/get_backgrounds.php?folder='+folder
})
.done(function( html ) {
$('.background_sample').html(html);
if ($(window).width() <= 320 || $(window).height() <= 480) {
var s1 = $('.slider1').bxSlider({
slideWidth: 230,
minSlides: 1,
maxSlides: 1,
slideMargin: 10,
pager: false
});
}else{
var s2 = $('.slider1').bxSlider({
slideWidth: 265,
minSlides: 2,
maxSlides: 3,
slideMargin: 10,
pager: false
});
}
})
.always(function() {
alert( "complete" );
$('.convert').on("click", function(){
$('.convert').css({border: '2px solid transparent'}).animate({
opacity: 0.5
}, 500 );
$(this).css({border: '2px solid #f37736'}).animate({
opacity: 1
}, 500 );
});
});
}
});
我的代码:返回
function get_backgrounds($folder){
//image backgrounds
$backgrounds = array();
if ($handle = opendir("../backgrounds/".$folder)) {
//$backgrounds = array();
while (false !== ($entry = readdir($handle))) {
$backgrounds[] = $entry;
}
foreach ($backgrounds as $key => $value) {
if($value == '.' || $value == '..'){
unset($backgrounds[$key]);
}
}
}
$i = 0;
echo '<div class="slider1">';
foreach ($backgrounds as $key => $value) {
if($i == 0){
$selected = 'checked="checked"';
}else{
$selected = '';
}
$idvalue = 'data'.$key;
echo '<div class="slide">';
echo '<div class="background_thumb">';
echo '<label class="fb" for="'.$idvalue.'">';
echo '<input '.$selected.' type="radio" name="background" id="'.$idvalue.'" value="'.$value.'">';
echo '<img class="convert" src="backgrounds/'.$folder.'/'.$value.'">';
echo '</label>';
echo '</div>';
echo '</div>';
$i++;
}
echo '</div>';
}
Android 4.4.2中的任何原因都可以,但在Android 4.3及更低版本中,内容已经存在,但我无法看到它。
知道发生了什么???
答案 0 :(得分:0)
当然这是一个CSS问题,由于某些原因我失去了高度,所以我的解决方案:
$('.slider1').bxSlider({
slideWidth: 265,
minSlides: 2,
maxSlides: 3,
slideMargin: 10,
pager: false,
onSliderLoad: function(){
$('.bx-viewport').css({"height":"80px !important"});
$('.convert').css({"height":"80px !important"});
}
});