Hello everyone, I am currently attempting to deactivate the theme/style on a fixed header within the following code snippet:
<div id="home-header" data-role="header" data-id="mobile-header" role="banner"
data-position="fixed" style="background-color: #FF8040;
class="ui-header ui-header-fixed slidedown"
-webkit-box-shadow: 0px 0px 8px 2px #000000;
-moz-box-shadow: 0px 0px 8px 2px #000000; box-shadow: 0px 0px 8px 2px #000000;">
<span class="ui-title" role="heading" aria-level="1">
Temporary text
</span>
</div><!-- /Header -->
I have attempted using data-role="none", but it only disrupts the fixed header (causing it to float at the bottom of the screen). Removing the class= did not work either as it would reappear in the rendered code automatically.
Is there a method to achieve this without affecting the regular functioning of a fixed header in JMobile?
Thank you.
update #1
#home-header {
background-color: #FF8040 !important;
-webkit-box-shadow: 0px 0px 8px 2px #000000 !important;
-moz-box-shadow: 0px 0px 8px 2px #000000 !important;
box-shadow: 0px 0px 8px 2px #000000 !important;
}
<div id="home-header" data-role="header" data-id="mobile-header" data-position="fixed" role="banner">
<h1 class="ui-title" role="heading" aria-level="1">
Temp test here
</h1>
</div><!-- /Header -->
update #2
.ui-bar-a {
border: 1px solid #FFA346 !important;
background: #FF8040 !important;
-webkit-box-shadow: 0px 0px 8px 2px #000000 !important;
-moz-box-shadow: 0px 0px 8px 2px #000000 !important;
box-shadow: 0px 0px 8px 2px #000000 !important;
}