窗口使用JavaScript

我在我的项目中的多个列表视图中如何实现下面的代码感谢语义缩放提前窗口使用JavaScript

<section aria-label="Main content" role="main"> 
     <div id="detailsSection" style="width: 100%; overflow-x: 
     scroll;height:100%;overflow-y:hidden;"> 
      <table style="height:100%;"> 
       <tr>      
        <td style="width: auto; height:100%;" id="myDealsSection"> 
         <table style="height:100%;margin-left:120px; 
     margin-bottom:50px;"> 
          <thead> 
           <tr> 
      <td style="font-size: 17pt;font-family: 'segoe ui';width:100px; 
    height: 12px;padding-left:5px;"><span id="MyDeals">My Deals</span></td><td> 
    <img id="dealsHeaderImg" src="/images/Arrow1.png" style="display:none; 
    padding-left:5px;"/></td> 
           </tr> 
          </thead> 
          <tbody> 
           <tr> 
       <td colspan="2" style="width:auto;height:100%;vertical-align: top;"> 
         <div id="homePageDealsList" aria-label="List of this group' 
    s items" style="height: 100%; width: auto;" data-win-control="WinJS.UI.ListView" 

    data-win-options="{ selectionMode: 'single',layout: {type:WinJS.UI.GridLayout} }"> 

    </div> 
            </td> 
           </tr> 
          </tbody> 
         </table> 
        </td>      
        <td style="padding-left: 50px; width: auto;height:100%;" 

    id="trackDealsSection"> 
         <table style="height:100%;"> 
          <thead> 
           <tr> 
            <td style="font-family: 'segoe ui';height: 

    12px;width:120px;padding-left:5px;font-size:17pt;"><span id="TrackDeals">Track 

    Deals</span></td><td><img id="trackdealsHeaderImg" src="/images/Arrow1.png" 

    style="display:none"/></td> 
           </tr> 
          </thead> 
          <tbody> 
           <tr> 
            <td colspan="2" style="width: auto;height:100%; 

    vertical-align: top;"> 
             <div id="trackDealsList" 

    class="trackDealsItemsList" aria-label="List of this group's items" 

    style="height:100%; width:auto;margin-bottom:50px;" data-win- 

    control="WinJS.UI.ListView" data-win-options="{ selectionMode: 'single', layout: 

    {type:WinJS.UI.GridLayout} }"></div> 
            </td> 
           </tr> 
          </tbody> 
         </table> 
        </td> 

    </tr> 

     </table> 

    </div>

此代码时，我实现语义缩放它不显示任何数据8语义缩放.so如何解决此问题。请单击。

来源

2013-02-21 mahesh

组成语义缩放的listView必须是语义缩放控件的唯一子元素。像这样的东西...

<div id="semanticZoomDiv" data-win-control="WinJS.UI.SemanticZoom"> 

    <!-- The zoomed-in view. -->  
    <div id="zoomedInListView" 
     data-win-control="WinJS.UI.ListView" 
     data-win-options="{ itemDataSource: myData.groupedItemsList.dataSource, itemTemplate: select('#mediumListIconTextTemplate'), groupHeaderTemplate: select('#headerTemplate'), groupDataSource: myData.groupedItemsList.groups.dataSource, selectionMode: 'none', tapBehavior: 'none', swipeBehavior: 'none' }" 
    ></div> 

    <!--- The zoomed-out view. --> 
    <div id="zoomedOutListView" 
     data-win-control="WinJS.UI.ListView" 
     data-win-options="{ itemDataSource: myData.groupedItemsList.groups.dataSource, itemTemplate: select('#semanticZoomTemplate'), selectionMode: 'none', tapBehavior: 'invoke', swipeBehavior: 'none' }" 
    ></div> 

</div>

您的标记布局的方式，你不能使用它的语义缩放。结账出Semantic Zoom Quickstart,Guidelines for Semantic Zoom和Semantic Zoom Sample。

来源

2013-02-21 15:44:48

窗口使用JavaScript

回答

相关问题