使用jQuery更改多个背景图像 [英] Change multiple background-images with jQuery

问题描述

在我的css页面，我有这个代码：

In my css page, i have this as code:

header {
    background:url('afbeeldingen/r.png'),url('Afbeeldingen/black.jpg');
    background-position: 50% 33%, left top;
    background-repeat: no-repeat, no-repeat;
    background-size:26%,960px 130px;
    margin-left:auto;
    margin-right:auto;
}

现在在我的html页面中，我想使用JQuery来更改第一个图像当我悬停在我的导航栏。
你能帮我吗？

Now in my html page, I want to use JQuery to change the first image when I hover my navigation bar. Can you please help me?

推荐答案

使用类标题到你的导航按钮， / p>

Use class header to your navigation button wherever you want to do this work

.header {
    background:url('afbeeldingen/r.png'),url('Afbeeldingen/black.jpg');
    background-position: 50% 33%, left top;
    background-repeat: no-repeat, no-repeat;
    background-size:26%,960px 130px;
    margin-left:auto;
    margin-right:auto;
}


<script>
$(".header").hover(function(){
   $(this).css("background","url('Afbeeldingen/black.jpg'),url('Afbeeldingen/anotherhoverimage.jpg')"); 
});

$(".header").mouseout(function(){
   $(this).css("background","url('afbeeldingen/r.png'),url('Afbeeldingen/black.jpg')"); 
});
</script>

这篇关于使用jQuery更改多个背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！