CSS和/或點擊圖像

JavaScript的變化的背景我有一個問題，我有一個div class="tasteTheRainbow"和裏面的img標籤。一個標籤特別是名爲.gA3的png類。CSS和/或點擊圖像

現在tasteTheRainbow已經有一個CSS的背景網址，但當你點擊或點擊.gA3我想要更改背景網址。

我已經嘗試了許多其他計算器帖子，發現無解。

這是我的HTML和我的CSS：

<div class="tasteTheRainbow"> 
    <div class="greenArrow"> 
     <img class="gA1" src="assets/arrows/down.png"/> 
     <img class="gA2" src="assets/arrows/in.png"/> 
     <img class="gA3" src="assets/arrows/left.png"/> 
     <img class="gA4" src="assets/arrows/out.png"/> 
     <img class="gA5" src="assets/arrows/right.png"/> 
     <img class="gA6" src="assets/arrows/up.png"/> 
    </div> 
</div>

.tasteTheRainbow { 
    background-image: url(../assets/fivePix.png); 
    background-repeat: repeat; 
    position: absolute; 
    background: url(../assets/tombrady1.jpg) no-repeat center center fixed !important; 

    -webkit-background-size: cover; 
    background-size: cover; 
    display: block !important; 
}

正如我上面提到我已經使用CSS classname:active嘗試。我也嘗試了多個Java腳本解決方案，他們根本不會將背景url更改爲image1到image2。

來源

2015-04-22 RubberDucky4444

你能分享你的JavaScript或jQuery的點擊事件，這應該是觸發背景的URL更改？ –

擺脫！重要聲明。它覆蓋了您可能聲明的任何新背景圖像，因爲它首先要考慮的。 – Marquizzo

我推薦的解決方案是爲元素的初始狀態（例如.tasteTheRainbow）以及新狀態（例如.tasteTheRainbowNew）創建CSS類，然後使用Javascript應用/刪除類。

$(function() { 
    $(".gA3").click(function() { 
     $(this).parent(".tasteTheRainbow").toggleClass("tasteTheRainbowNew"); 
    }); 
});

見我的jsfiddle這裏：http://jsfiddle.net/oxv0rc1k/2/

另外請注意，我在JQuery的加載，因爲我的JS吸收離不開它。

來源

2015-04-22 04:23:46

迷人加載:) –

謝謝你，這很容易遵循！ – RubberDucky4444

不是問題！很高興我能提供幫助，並感謝您將此標記爲正確答案！ –

CSS和/或點擊圖像

回答

相關問題