0

我尝试将几个小画布元素添加到手风琴内容区域。如何动态扩展内容的宽度？

http://jsfiddle.net/WBHUk/

<div data-role="page" id="page">
    <div data-role="header">
        <h1>Header</h1>
    </div><!-- /header -->
    <div data-role="content" id="content01">
    </div><!-- /content -->
    <div data-role="footer">
            <h4>Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->


$('#content01').append('<div data-role="collapsible-set" data-theme="c" data-content-theme="d" id="acc01"></div>').trigger("create");
$('#acc01').append('<div data-role="collapsible" data-collapsed="false" id="acc01a"><h3>First</h3><div id="acc01a1"></div></div>').trigger("create");
$('#acc01').append('<div data-role="collapsible" id="acc01b"><h3>Second</h3><p>TODO</p></div>').trigger("create");
$('#acc01').append('<div data-role="collapsible"><h3>Third</h3><p>TODO</p></div>').trigger("create");

for(var ch=0; ch<20; ch++){
    $('#acc01a1').append('<div id="c_panel'+ ch + '" class="chpanel"></div>');
    $('#c_panel' + ch).width(80);
    $('#c_panel' + ch).height(30);
    $('#c_panel' + ch).append('<canvas id="cccanvas' +ch+ '" class="cccanvas" width="80" height = "30"></canvas>').trigger("create");
    $('#c_panel' + ch).css( "position", "relative" );
    $('#c_panel' + ch).css( "float", "left" );
    $('#c_panel' + ch).css( "background-color", "yellow" );
    $('#c_panel' + ch).css( "margin", "2px" );
    $('#c_panel' + ch).css( "border-radius", "5px" );

    var ctx = $('#cccanvas' + ch)[0].getContext("2d");

}

非常感谢马特乔

4

0 回答 0