核心抽屜面板關閉時是否檢測到？

我試圖檢測用戶在網站上點擊核心抽屜面板時的情況。核心抽屜面板關閉時是否檢測到？

我想獲得div的一些屬性來響應核心抽屜面板是否打開/關閉。

我已經設法通過爲我已經使用的菜單圖標添加一個事件偵聽器來打開它，但它是我遇到問題的核心抽屜面板的關閉。

任何幫助，將不勝感激！

<body fullbleed layout vertical> 

<template is="auto-binding"> 

    <core-drawer-panel id="drawerPanel"> 

     <core-header-panel id="drawerCHP" drawer> 

      <core-toolbar id="navheader"> 
       <span>My Webpage</span> 
      </core-toolbar> 

      <core-menu selected="0"> 
       <core-item icon="home" label="Home"></core-item>  
       <core-item icon="settings" label="Settings"></core-item> 
       <core-item icon="help" label="Help"></core-item> 
      </core-menu> 
     </core-header-panel> 

     <core-header-panel id="chp" main mode="seamed"> 
      <core-toolbar id="mainHeader"> 
       <paper-icon-button id="navicon" icon="menu"></paper-icon-button> 
      </core-toolbar> 
      <div class="content"> 
       <!-- Content Goes Here --> 
      </div> 
     </core-header-panel> 
    </core-drawer-panel> 

    <script>  
     document.getElementById("navicon").addEventListener("click", openDrawer); 

     function openDrawer() { 
      document.getElementById("drawerPanel").togglePanel(); 
     } 
    </script> 
</template>

我還沒有使用的聚合物應用中的核 - 抽屜面板，所以我不能使用事件如核心響應變化。

來源

2015-02-08 sbranturesh

通常'核心響應改變'事件應該做的工作。顯示一些代碼，甚至可以更好地設置在線示例。這將有助於獲得更好的答案。 – 2015-02-09 09:45:02

@GoceRibeski我已經添加了一些示例代碼，但是我沒有在Polymer應用程序中使用核心抽屜面板，這在試圖使用核心響應式更改時可能會遇到問題。我試圖找到一個使用JavaScript的替代品，但沒有運氣？！ – sbranturesh 2015-02-09 11:10:24

我認爲'狹窄'屬性是關鍵，做了一些測試，但它不像我預期的那樣工作： http://plnkr.co/edit/m2u3qN5URq5V3flbXVQz?p=preview – 2015-02-09 12:18:05

尋找核心抽屜面板的源代碼，它看起來像你可以使用document.querySelector('core-drawer-panel').isMainSelected()方法並獲得真/假返回。如果爲真，則表示該面板已關閉，並且爲false表示面板已打開。

來源

2015-02-09 16:51:25

它太棒了！感謝那！ – sbranturesh 2015-02-09 19:21:22

核心抽屜面板關閉時是否檢測到？

回答

相關問題