點擊圖片時不同背景圖片之間的變化

Question

我是一個設計網站的新手，我試圖在沒有任何成功的情況下找到我的問題的答案。 （至少沒有任何答案可以幫助我理解我該怎麼做）

無論如何。我正在做這個網站，當我點擊另一張圖片時，我想更改網站上的背景圖片（連接的頁面）。我也希望背景圖像保持不變，即使在不同頁面之間跳轉時也是如此。

有人可以解釋我應該怎麼做？很高興在「虛擬網絡設計方式」。 （我在學校的網頁設計類，但老師不能解釋它）

Answer 1

我會盡力指出你在正確的方向。 單擊用戶界面元素時需要執行某些操作，您需要使用onclick事件（https://developer.mozilla.org/en/docs/Web/Events/click）。接下來你必須做的是以某種方式堅持對用戶進行圖片更改（或者對於所有用戶，您沒有指定）。例如，您可以使用Cookie Web API（https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie）執行此操作。那麼你當然也需要加載存儲在該cookie中的圖像。

Answer 2

我不知道你使用的是什麼框架，但我覺得要做到這一點，最好的辦法是包括一個CSS類的背景圖像像這樣：

.background-image-1 { background-image: url("../path/to/image1") }

.background-image-2 { background-image: url("../path/to/image2") }

然後添加一個事件處理程序來點擊您想要更改背景的圖像。在事件處理程序中，您可以動態切換正文的css類。這可能會是這個樣子：

document.getElementById('idForBody').className = 'background-image-2';

希望這有助於！