Javascript：transitionend 的 addEventListener 不執行 function
[英]Javascript: addEventListener for transitionend does not execute function
我有以下代碼，它應該使橫幅淡入視野，它確實如此。 但是，一旦轉換完成，我想觸發其他效果，但我無法讓transitionend事件觸發對 function 的調用。 我在 Chrome v93 中執行這個，這個網站說它支持transitionend 。 我的控制台日志顯示： 如您所見，確實添加了淡入 ...
eventListener 中轉換后的高度值不正確
[英]Incorrect height value after transition in eventListener
var container = document.querySelector(".container"); var bar = document.querySelector(".bar"); var barL = document.getElementsByClassName("bar ...
重復執行transitionend事件
[英]Duplicated executions of transitionend event
我想了解為什么以下代碼會以指數方式復制 transitionend 的返回。 這對我來說沒有任何意義，因為它們應該具有相同的行為並且應該只執行一次。 下面評論了預期的行為。 (function() { var animations = { start: function() { console.l ...
滾動時隱藏導航欄的上部（平滑！）
[英]Hide the upper part of the navbar when scroll (smoothly!)
您好，我定制了一個 2 行的 Bootstrap 導航欄（上半部分只是徽標和社交鏈接，下半部分是導航鏈接）。 我試圖在滾動時隱藏上半部分，但我找不到順利完成它的方法。 我認為下面的代碼是我找到的最佳解決方案，但目前transitionend 上的事件監聽器不起作用，並且從未添加 class 'hi ...
jQuery：解除綁定 transtionend 事件
[英]jQuery: Unbinding transtionend event
每次調用此操作時，我都希望一個對象先向左移動，然后再向上移動。 第一次工作正常，但第二次時，對象對角線移動，而不是逐步移動。 目前我有這個： 關於如何實現步進動畫的任何其他建議？ 我如何解除這兩個“綁定”的綁定，以便它在每個動作上都像第一次一樣運行？ ...
列表離開動畫和 DOM 更新后的回調 - VueJS
[英]Callback after list leave animation and DOM update - VueJS
要在 Vue 更新 DOM 后做某事，您可以使用$nextTick綁定。 要在 css 轉換完成后執行某些操作，可以使用transitionend事件。 我有一個動態列表，其中通過用戶操作添加和刪除內容。 移除后，會有一個 CSS 動畫，然后我需要在元素消失后立即檢查 DOM 的狀態。 我在想 ...
刪除鼠標懸停時添加了懸停和animationend的類
[英]Remove class added with hover and animationend on mouseout
在transition或keyframes動畫結束后，我嘗試了transitionend和animationend來更改css。 我為這兩個變體制作了一個示例，它們均按預期工作：當transition或動畫結束時，可以toggle class 。 懸停時，我開始過渡/動畫，並在JavaScr ...
'addEventListener'僅onclick
[英]'addEventListener' only onclick
我僅在完成另一個菜單（移動導航）上的轉換后，才使用“ addEventListener”打開菜單（流派容器）。 問題是，一旦所有內容都關閉並且我嘗試重新激活mobile-nav，即使我沒有單擊genres-container，“ addEventListener”似乎也會啟動。 我想要的是關 ...
Transitionend事件在較寬的屏幕上過早觸發了100％的寬度？
[英]Transitionend event firing prematurely for 100% width on wider resolution screens?
當編輯器打開時，我會略微收縮計划程序，然后在編輯器關閉時，將計划程序滑回100％的寬度，並且必須進行調整大小，以便事件全部移至新的正確位置。 問題是，在更大的屏幕上，transitionend事件似乎過早觸發。 我在附接到調度程序的transitionend結束事件中添加了一個斷點，當調 ...
切換功能在過渡端觸發兩次
[英]Toggle function fires twice on transitionend
我有一個開關，我用 jQuery 調用它的checked狀態。 每次我單擊從未選中到選中的切換時，控制台都會記錄"do this!" 兩次。 為什么這個函數會觸發兩次，讓它觸發一次的解決方法是什么？ $("#my-toggle").bind("transitionend webkit ...
使用transitionend事件偵聽器進行響應以創建轉換
[英]Using transitionend event listener with react to create a transition
我正在嘗試進行一個簡單的過渡，在按鈕單擊時做出反應，其中body max-height在componentWill update上變為0，然后在componentDidUpdate上變回500px或100％。 從我見過的其他問題來看，我並不是很了解它，所以有人可以給我一個例子，說明它是如何工作 ...
masonry.js-具有過渡效果的布局項目
[英]masonry.js - layout items with transition effect on them
我在我的項目中使用基因敲除（knockout.js）和石工（masonry.js）。 因此，根據石工文檔的建議，我使用reloaditems方法將DOM的更改應用於石工。 在我向項目添加懸停過渡效果之前，它工作正常。 這是代碼 。 如您在按下“加載更多！”后所看到的 按鈕砌築似乎重 ...
當初始狀態和最終狀態相同時，不會觸發 transitionend
[英]transitionend is not fired when initial state and final state are the same
在下面的示例中，我正在使用 CSS 進行background-color轉換，並嘗試處理兩個 div 的transitionend事件。 不幸的是，由於初始和最終背景顏色相同，因此不會為div2觸發transitionend ： var div1 = $('#div1'); var ...
過渡端不觸發
[英]Transition end does not fire
我有一個用動畫隱藏和顯示方法創建模態窗口的想法，我希望它可以與CSS過渡一起使用。 我創建了原型https://jsfiddle.net/7bkvcvqq/，一切看起來都很好，但是當我單擊“快速”按鈕觸發觸發顯示和隱藏時沒有延遲時，事件過渡結束不會觸發，並且模態窗口仍在頁面上。 您可以進 ...
Mootools不支持Transitionend Enven嗎？
[英]Mootools does not supports transitionend enven?
$(element).addEvent('transitionend', function(e){ // do soming... }); 在Firefox中，它不起作用。 但是，使用addEventListener而不是addEvent可以正常工作。 mootoo ...
用JavaScript循環等待過渡
[英]Waiting for transitionend in a loop with JavaScript
我已經習慣於使用jQuery，因此似乎無法弄清楚如何用純Javascript做到這一點。 我不想使用jQuery，因為這是我在網站上使用的唯一代碼段，並且庫太大而不能用於此目的。 這是jQuery腳本（正在運行）： http : //jsfiddle.net/1jt6dhzu/2/ ...
ie9的過渡結束回退
[英]Transition End Fallback for ie9
我在jquery中使用以下代碼來觸發transitionend上的事件，並避免多個回調/支持多個瀏覽器： （代碼在這里： http : //davidwalsh.name/css-animation-callback ） 但是，無論前綴/語法如何，ie9似乎都不支持transiti ...
動畫未完成jQuery TransitionEnd事件
[英]Animation doesn't complete with jQuery TransitionEnd event
情況 單擊.rightnav.front以獲取DIV1。 DIV1向右移動，不透明度降低 DIV1向左移動，完成時不透明度為0 DIV1獲取類.hidden和.offset來隱藏它並將其移出屏幕，因此它不再可單擊。 下一個DIV（用於測試目的的IDV為2 ...
'transitionend'事件不會持續發射
[英]'transitionend' event does not fire consistently
以下代碼與Chrome和Firefox（與“transitionend”）不一致。 函數slogan_fade_next只是console.log('end'); 。 我總是將類名應用於第一個span元素，但是當我單擊刷新按鈕，重新加載或其他任何內容時，其后的任何內容都會被擊中。 應 ...
在沒有jQuery或Modernizr等框架的情況下，輕松檢測對transitionend事件的支持？
[英]Easy way to detect support for transitionend event without frameworks like jQuery or Modernizr?
有沒有人找到一種簡單的方法來檢測瀏覽器是否支持transitionilland事件在vanillaJs中，特別是在所有主流瀏覽器中實際運行的方式？ :( 我在這里找到了這個沒有答案的帖子： 測試Firefox中的transitionend事件支持 ，以及相當多的工作黑客。 現在我正 ...