java - How to set conditional WebView resizes on a Cordova/Phonegap project? -
i'm using plugin creates webview (appodeal banners) overlaps main apps webview. theres not way fix manipulating html tags because elements mess
default banner settings
32px : device screen height <= 400
50px : 400 < device screen height <= 720
90px = device screen height > 720
so webview must resize height according appodeal banner height.
example:
if (device.screen.height <= 400) { webview.height = webview.height - "32px" }
ps: i'm not java programmer web developer only
i'm not sure have resize root webview on admob banner show (i'm not sure possible @ all). need re-layout content of main webview when banner shown. if understood post right, use appodeal phonegap plugin uses 1 more webview component show ads. in case know about:
- banner placement (top or bottom), b/c request explicitly (
appodeal.banner_top | appodeal.banner_bottom
); - banner size (you described in question);
- a fact banner appeared (
document.addeventlistener('onbannershown', function(){...});
);
so, i'd prepare empty placeholders in html template, add css rules hide them when no appodeal banner shown, , onbannershown
event display corresponding placeholder , resize webview content.
<style> .appodeal-top { position: absolute; top: 0; left: 0; right: 0; height: 0; } .main-content { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .appodeal-show .appodeal-top { /* replace appropriate value calculated on device height */ height: 50px; } .appodeal-show .main-content { /* replace appropriate value calculated on device height */ top: 50px; } </style> <script> document.addeventlistener('onbannershown', function(){ document.getelementbyid('root').classname = 'appodeal-show'; }); </script> <div id="root"> <div class="appodeal-top"></div> <div class="main-content"> ... </div> </div>
(i didn't try code - shows idea).