How to overcome the header fixing error in phoneGap with jQuerymobile?

         At the development time of   Fashion Girl Problems App using phone-Gap I faced some problem while fixing the page header in iPhone App. Here in my app pages has large list with scrolling for the designing implementation I used jQuery mobile . 

General header fixing snippet in mobile jQuery

<div data-theme="a" data-role="header” data-position="fixed” style="background-color: #FF679A"> 

data-position="fixed” –> Sometimes this property won't work properly in iPhone means header will move along with scroll, this is one error .

How to overcome??

 Instead of using data-position="fixed” property you need to add some css snippet manually like

                         .header {

                                        position : fixed;

                                        z-index  : 10;

                                         top      : 0;

                                         width    : 100%

                                      }

Header fixing using user defined css snippet . . . !

<div data-theme="a" data-role="header" class="header" style="background-color: #FF679A">