網站搜尋

javascript - 使用有限的 CSS 技能創建可調整大小的網站 - CSS 形狀

這是我在這裡的第一個問題,所以請指出我犯的任何錯誤。 我被要求創建一個看起來像某隊旗幟的網頁。我已經設法做到,但僅能使用固定大小的元素:

在其他解析度下,它就是不適合螢幕顯示。 代碼: html

<div id="centered"> <div id="triangle-down"></div> <div id="triangle-right"></div> <div id="tria

閱讀更多 →

javascript - 將視野值轉換為 CSS3D 透視值

如果我想要一個視野為60°的相機,那麼如何計算CSS3D的透視值呢?

perspective: ?; perspective-origin: center center;

我找到了一個關於如何從透視值計算投影矩陣的描述,但我仍然不是很理解它:http://www.w3.org/TR/css-transforms-1/#perspective-matrix-computation

所以如果我有一個給定的視野,並且我知道元素的 offsetWidth/offsetHeight,那麼我應該如何計算所需的透視值?

那近裁剪面和遠

閱讀更多 →

javascript - 滑鼠懸停圖片放大並在其上顯示文字 CSS3

我正在嘗試為我的網站製作一個響應式圖片頁面。到目前為止,我已經將頁面上的圖片設置為對所有瀏覽器尺寸都能響應並保持居中。

我的問題是,當我將滑鼠懸停在圖片上時,它會放大,但會將其他所有圖片推開。我希望它可以放大,但其他圖片保持原位,我已經嘗試過使用絕對定位,但這不起作用。

我也非常想在圖片上添加懸停文字,我希望當滑鼠移到圖片上時,你可以從中心看到文字。我希望這只用 HTML/CSS 就能實現,不需要單獨的文字圖片,也可能不使用 JavaScript。

這是我目前的 HTML;

<div class="imgwrap"> <img s

閱讀更多 →

我可以用 Javascript 設定同一個 CSS 屬性的多個值嗎?

我想用程式方式將 CSS cursor 的值同時設置為 -webkit-grab 和 -moz-grab。例如,在樣式表中,它會表示為

mySelector{ cursor:-webkit-grab; cursor:-moz-grab; }

所以在這裡,mySelector 元素定義了兩次游標。Webkit 瀏覽器使用第一個定義,Firefox 使用第二個。我想知道是否有任何方法

閱讀更多 →

c# - 在使用 System.Web.Optimization 綁定壓縮時,有沒有辦法禁用 js/css 驗證?

我正在使用 .NET 4.5 System.Web.Optimization 進行捆綁。當開啟最小化功能捆綁文件時,我發現有些 CSS 和 JavaScript 無法被最小化,因為沒有通過驗證機制。這些文件會收到類似的訊息

/* Minification failed. Returning unminified contents. (5616,18): run-time error CSS1036: Expected expression, fou

閱讀更多 →

javascript - WKWebView 在螢幕旋轉時的 CSS 渲染問題

首先,一切在所有可能的 iOS 版本上的 UIWebView 上都運作完美,因此這是一個特定的 WKWebView 問題。

在我完成 WKWebView 的實作後,我遇到了一個重大的圖形錯誤/問題。在直式時,我的應用程式運作正常,但當我將它旋轉到橫式時,出現了一些奇怪的情況,我的標題和頁腳無法正確呈現。

如果我查看我的網頁代碼,我可以看到 CSS 寬度在 DOM 中正在獲得更新,且數據是正確的,但我只能看到標頭/頁腳在直向(320px)方向的寬度,即使它在 DOM 中顯示為 style=“width: 568px; ”。

我正在使用 positioning:fixed,但如果我改成 positioning:relative,它在螢幕旋轉時會如預期般渲染(可惜在這種情況下相對定位不是選項)。如果我點擊標題/頁腳或在螢幕上滾動某處,標題和頁腳會以某種方式更新並正確渲染,並如預期顯示(只需滾動 1px)。

我會嘗試說明它的樣子。

紅色=可見藍色

閱讀更多 →

javascript - npm 腳本 nodemon - 監控 js 和 scss 文件的變化

我正在嘗試建立一個開發環境,只使用 NPM,而不使用 grunt.js 或 bower.js。

我遵循了這個教學: http://beletsky.net/2015/04/npm-for-everything.html

我正在使用 nodemon 來監控我的 .js 和 .scss 檔案的變更,這會重新啟動 node 伺服器。所以在我的 package.json 檔案中,在 scripts 下我有

腳本:

"watch": "npm run watch-js & npm run watch-sass"

閱讀更多 →

jquery - 如何在頁面加載時或使用 Javascript 自動打開僅使用 CSS 的彈出窗口?

我已經建立了一個僅用 CSS 的彈出視窗,它僅能透過點擊連結/按鈕來觸發。我想在頁面加載時自動顯示這個彈出視窗。此外,這個彈出視窗如何在不點擊連結/按鈕的情況下打開,也就是使用 Javascript/jQuery。

小提琴

.modalDialog { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 99999; opacity: 0; -webkit-tran

閱讀更多 →

javascript - 為一個 CSS 屬性設置多個值

是否有可能為一個 CSS ID 的單一屬性設置兩個值,例如

高度:12em;高度:12rem;

對於單一的 id?我知道可以用 CSS 來做這個,但我想透過 JavaScript 改變高度,並且在一個屬性上有兩個值,這樣 'em' 就可以作為不支援 'rem' 的瀏覽器的備援。

範例:

function updateHeight() { var testElem = document.getElementById("testId"); testElem.style.height = "12em"; testElem.s

閱讀更多 →

javascript - 根據真實的白天和夜晚時間更改 CSS 樣式

我一直在跟隨這個教程。它在 30 分鐘後會有動畫變化成白天和黑夜,非常好,我很喜歡,但我在想如何讓這個變化按照真正的白天時間進行,這樣它就可以根據實際時間自動變換白天和黑夜。我不知道該怎麼做,有沒有人可以幫助我,這裡是代碼 :-

HTML

<div id="sky"></div> <div id="sun_yellow"></div> <div id="sun_red"></div> <div id="clouds"></div&

閱讀更多 →