Will data-position = "fixed" work for divs other than header and footer

I have a div (phone-no) that needs to be fixed and it is just above the footer. When we resize the window, the user should be able to see the "phone-no" div. here the image is a blue bar, which says that the โ€œfree trialโ€ is a fixed bar, and the bottom line below is the footer.

When I tried data-position = "fixed" on the header and footer, it works, but not on that. Any insight link to the page

+3
source share
2 answers

Live example:

HTML:

<div data-role="page" data-theme="b" id="jqm-home"> 
    <div data-role="header" data-position="fixed"> 
        <h1>Header</h1> 
        <a href="#" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home">Home</a> 
    </div>

    <div data-role="content"> 
        <p>Content</p>
    </div>

    <div data-role="footer" data-id="foo1" data-position="fixed"> 
        <div data-role="navbar"> 
            <ul> 
                <li></li> 
                <li></li>
                <li>Footer</li>
                <li></li> 
                <li>(888)444-8901</li> 
            </ul> 
        </div>
    </div>

</div>
+2

$("[data-role=header]").fixedtoolbar({ tapToggle: false });
$("[data-role=footer]").fixedtoolbar({ tapToggle: false });

+3

All Articles