窗口使用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

回答

相關問題