如何建立自訂事件來追蹤 CSS 屬性變更？

追蹤 CSS 屬性變更的自訂事件

問題：當 div 或任何CSS 屬性變更？

討論： 雖然沒有內建 CSS 變更事件，但您可以建立自己的 CSS 變更事件。有兩種方法：

方法一：DOM輪詢

<code class="javascript">var $element = $("#elementId");
var lastHeight = $("#elementId").css('height');

function checkForChanges() {
  if ($element.css('height') != lastHeight) {
    // CSS height changed
    lastHeight = $element.css('height');
  }
  setTimeout(checkForChanges, 500);
}
checkForChanges();</code>

方法二：手動事件觸發

<code class="javascript">$('#mainContent').bind('heightChange', function() {
  // CSS height changed
});

$("#btnSample1").click(function() {
  $("#mainContent").css('height', '400px');
  $("#mainContent").trigger('heightChange');
});</code>

優點：

• 方法一是自動的，不斷監控DOM 的變化。
• 方法二控制性更強，只有修改時才觸發事件CSS。

文件：

• 綁定：將事件處理程序附加到指定元素。
• 觸發：執行事件附加到元素的處理程序。

以上是如何建立自訂事件來追蹤 CSS 屬性變更？的詳細內容。更多資訊請關注PHP中文網其他相關文章！