how do admob banner not overlap app screen?

[pcschoolleo]

hi
i use phonegap 3.1+ios 7+admob
ad will show ,but it will overlap app screen
how do fix this problem
i want to put banner in the top,but not overlap my screen
picture1 is banner overlap  app screen
picture2 is no banner,and u can see app screen
picture3 is i use <br><br><br>in the index.html  to put banner lower

[Rjfun Mobile]

If you write Obj-C code, you can try moving the webview a little bit.

CGRect pb = self.webView.superview.bounds, wf = self.webView.frame, bf = self.bannerView.frame;
wf.origin.y = bf.size.height;
wf.size.height = pb.size.height-wf.origin.y;
self.webView.frame = wf;

Or, you may try a mature AdMob plugin to do this. There are quite a few options.

For example:

https://github.com/floatinghotpot/cordova-admob-pro

Just use 1-2 line of javascript to show a banner or interstitla Ad. 

By default, it shows the banner at top center without overlap.

var ad_units = {
    ios : {
        banner: 'ca-app-pub-xxx/xxx',
        interstitial: 'ca-app-pub-xxx/xxx'
    },
    android : {
        banner: 'ca-app-pub-xxx/xxx',
        interstitial: 'ca-app-pub-xxx/xxx'
    }
};
// select the right Ad Id according to platform
var admobid = ( /(android)/i.test(navigator.userAgent) ) ? ad_units.android : ad_units.ios;
// it will display smart banner at top center, using the default options
if(AdMob) AdMob.createBanner( admobid.banner );