![](/img/trans.png)
[英]Houdini gradient transition on hover with styled-component
請參閱此代碼示例: Houdini-gradient-borders 當我想在 React TS 中使用樣式化的組件重新創建此效果時,我將其編譯為沒有錯誤。 但是 hover 效果上的漸變不起作用。 我正在努力尋找解決方案來讓它發揮作用? 我的應用程序.tsx ...
[英]Houdini gradient transition on hover with styled-component
請參閱此代碼示例: Houdini-gradient-borders 當我想在 React TS 中使用樣式化的組件重新創建此效果時,我將其編譯為沒有錯誤。 但是 hover 效果上的漸變不起作用。 我正在努力尋找解決方案來讓它發揮作用? 我的應用程序.tsx ...
[英]Border-image conic-gradient example does not work in React
賞金將在 7 天后到期。 此問題的答案有資格獲得+50聲望賞金。 Figario正在從有信譽的來源尋找答案。 我正在努力在 React Typescript 中重做這個Codepen 。 我在這里的博文中找到了它 簡單的方法 - 創建 React App 並添加到 css 文件中,它工作得很好。 ...
[英]Why do css variable animations not work in web-components
我已經使用實驗性的@property功能成功創建了一個 css 變量動畫。 重要提示:這僅適用於 Chrome、Opera 或 Edge 兼容性表 document.addEventListener('DOMContentLoaded', () => { const rangeInput = ...
[英]Using CSS can I check if a browser supports the "CSS Properties and Values API" (Houdini) @property rule
隨着一些瀏覽器開始引入CSS Houdini API ,我想知道是否有任何方法可以確定CSS 屬性和值 API是否僅支持 CSS? 使用 Javascript,我可以檢查 API 是否存在:✅ typeof window.CSS.registerProperty !== 'undefined' ...
[英]Create a brightness function on Houdini CSS
是否可以使用 Houdini API 創建“亮度”function? 例如: 假設您創建了一個 CMS,人們可以在其中自定義 10 colors。 然而,頁面中的一些細節的顏色應該是原來 10 個的變體,有時更暗,有時更亮。 如果是這樣,您個人對創建該工作集有何看法? ...
[英]How do I use CSS Houdini in Next.js
我想在我正在構建的 Next.js 項目中使用 CSS Houdini。 我已經通過yarn安裝了 CSS Houdini package 我想與css-paint-polyfill polyfill 一起使用。 我在這里遵循 webpack 說明https://houdini.how/usage ...
[英]Can't pass extra args to CSS Houdini paint function?
我有一個 React/Electron 應用程序(帶有 .scss 文件和 CSS 模塊),我正在嘗試使用 CSS Houdini 的paint()函數。 我已經成功地調用了它,但似乎向paint()添加第二個參數會導致它失敗。 樣式.module.scss: testPaint.js: ...
[英]Can't import css houdini paint js file
我有一個 React/Electron 應用程序,我正在嘗試使用新的 CSS Houdini paint()函數(如本頁所示)。 在我的項目的index.html文件中,我添加了一個帶有 paintWorklet addModule()函數的腳本標記,如下所示: 然后在該testPaint.js ...
[英]Can't do JS-in-CSS for css-houdini paint?
我正在嘗試復制此示例; 我有一個 scss 文件,我在 React/Electron 項目中與模塊化 CSS 一起使用。 我想在同一個文件中定義paint要使用的函數,如示例所示: 但是,這無法通過CssSyntax error: Expected a pseudo-class or pseud ...
[英]How to make Houdini's Animation Worklet work?
我終於開始用 Animation Worklet 做一些滾動綁定的animation ,只是為了發現Surma 的演示不起作用。 甚至不是文章中的那個。 API 是否還在標志后面? 還是它以某種方式改變了? ...
[英]Why some rectangles are disappearing when there is a rectangle that covers the whole area?
我正面臨 css 油漆工作的問題,我想知道這是瀏覽器錯誤還是我做錯了什么。 在 worklet 中,我正在繪制幾個矩形。 如果其中一個覆蓋了整個區域,那么當我更改縮放級別時,其他的就會開始消失。 但是當我刪除context.fillRect(0, 0, width, height)一切都像魅力一樣 ...
[英]CSS Typed OM -- parsing background color?
const box = document.getElementById('rb'); console.log(box.computedStyleMap().get('background-color')) .red { background-color: #FF0000; } . ...
[英]Style select tag with css houdini Paint API
我在 css 中遇到了這個新功能,稱為 css Houdini。 我只是想知道是否有任何方法可以使用 css houdini 油漆 API 來設置 select 標簽的樣式。 我試過這個代碼片段。 任何幫助將不勝感激。 提前致謝。 Html - css 腳本 密碼筆 ...
[英]How to import/use library in Paint Worklet?
我正在嘗試檢查是否可以在 Paint Worklet 中使用 canvas 庫。 我嘗試測試是否可以使用 paper.js。 問題是我無法在 worklet 中加載庫,無法訪問庫的全局腳本和來自 web woker 的 importScripts 不起作用。 是否可以在paint Worklet ...
[英]Can the PaintWorklet be inlined?
使用 CSS Paint API 的慣用方式似乎是: 創建一個xyz.js文件 填充一個包含paint(ctx, geom, properties)函數的類 調用registerPaint ,將類作為參數傳遞 從index.html調用CSS.paintWorklet ...
[英]Is there something like "backdrop-transform" in CSS? Or some way to transform different regions of the same image/video/iframe/etc. independently?
在 CSS 中,我們有transform和filter ,還有backdrop-filter 。 但據我所知,我們沒有backdrop-transform或類似的東西。 解釋一下我的意思: backdrop-filter允許您過濾某個特定元素后面的東西,例如,您可以通過在該區域上放置一個div來調 ...
[英]How to manipulate pixel data of CSS PaintWorklet context?
Canvas的上下文支持createImageData和putImageData ,但是,paint worklet的paint方法中的上下文似乎不支持這些方法。 我知道它不允許從上下文讀取像素數據,因為在此文檔中已明確指出: Paint Worklet的上下文與上下文不是100%相 ...
[英]drawImage Houdini CSS Paint API
我正在Chrome 70上試用Houdini的CSS Paint API,但無法使用此示例: https : //github.com/w3c/css-houdini-drafts/blob/master/css-paint-api/EXPLAINER.md #繪制圖像 我通過這樣的自定義 ...
[英]Houdini - CSS Typed OM: How to get a value of a defined property through javascript
用例 我將自定義屬性 ' --animation-duration ' 定義為具有新的 ' registerProperty ' 函數的時間值: 在我的 CSS 中,我現在可以將此屬性添加到我的類中並調整它的值: 現在我想通過 javascript 在我的元素上獲取此屬性的值,始終以 ms ...