android view + jquery

Question

Je développe une application Android à l'aide de GUI webview. J'ai un élément qui contient la page. Il a un en-tête et un pied de page.

<div data-role="page"> 
    <div data-role="header"> 
    ... 
    </div> 
    <div data-role="content" id="bg_im"> 
    ... 
    </div> 
    <div data-role="footer"> 
    ... 
    </div> 
</div> 

je voudrais insérer une image en arrière-plan de div de contenu de telle sorte que tout le contenu ne prend pas plus d'espace que la taille de l'écran disponible.

i ont un javascript qui fait que:

document.getElementById("bg_im").style.height=Math.floor($(window).height() - $('#home_header').height() - $('#home_footer').height() +"px"; 

la fonction est exécutée lorsque la page est chargée.

tout fonctionne bien dans le navigateur de bureau (chrome, mozilla), mais échoue lorsqu'il est chargé dans WebView dans android. J'ai découvert que la raison est que la fonction .height() pour l'en-tête et le pied de page renvoie une valeur de 0.

aucune idée pourquoi? j'ai essayé this solution mais ça ne marche pas non plus. il renvoie toujours la taille d'en-tête/pied de page 0.

Answer 1

Votre problème principal vient probablement de votre méthode Math.floor(). Vous mélangez des opérations de concaténation de chaînes et d'opérations arithmétiques. Vous devriez séparer ces déclarations.

var newHeight = Math.floor($(window).height() - $('#home_header').height() - $('#home_footer').height()); 
$('#bg_img').prop('height', newHeight);