Add image to collapsable content header

喜欢而已 提交于 2020-01-04 04:35:10

问题


I'm following the collapsible content doc at - http://jquerymobile.com/demos/1.0a4.1/docs/content/content-collapsible.html

Is there a method of adding an image to the right, within the header field (in code below the header field is referenced by 'Test').

<div data-role="collapsible" data-collapsed="true">
        <h3>Test</h3><add image here>
    </div>

I can't seem to find anything in the docs.

Thanks for any help


回答1:


  • Live Example: http://jsfiddle.net/xMbyP/3/
  • Example #2: http://jsfiddle.net/xMbyP/4/
  • Navbar idea: http://jsfiddle.net/5Y3qT/12/

HTML

<div data-role="page" id="home"> 
    <div data-role="content">
        <div data-role="collapsible">
            <h3>I'm a header</h3>
            <p>I'm the collapsible content.</p>
        </div>
        <div data-role="collapsible" data-collapsed="true">
            <h3>With Image <img src="http://jquerymobile.com/demos/1.0a4.1/docs/lists/images/us.png" alt="US Flag" /></h3><p>I'm another collapsible content.</p>
        </div>
    </div>
</div>



回答2:


What about using two divs with left and right float inside main div?

<div data-role="collapsible" data-collapsed="true">
    <div style="float: left;"><h3>Test</h3><add image here></div>
    <div style="float: right;"><img src="parth/to/image.ext" /></div>
</div>


来源:https://stackoverflow.com/questions/6144503/add-image-to-collapsable-content-header

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!