gpt4 book ai didi

jQuery点击改变背景颜色

转载 作者:太空宇宙 更新时间:2023-11-03 21:46:47 25 4
gpt4 key购买 nike

我尝试使用 flexslider 在事件幻灯片上制作动画背景颜色,但我不知道该怎么做...所以我尝试制作一些简单但效果不佳的东西。

我有 4 张幻灯片,所以我只想在单击下一张幻灯片时更改 4 种颜色...

j查询

  $( function() {
$('.dot li').click( function() {
$('.wrapper').css('background', '#749e4f');
$('.dot li').click( function() {
$('.wrapper').css('background', '#d16b42');

});
});

导航 | flex slider

<div class="slider-nav">
<ul class="dot">
<li><a href="#">iphone 5<span class="bullet">1</span></a></li>
<li><a href="#">htc one <span class="bullet">2</span></a></li>
<li><a href="#">ipad mini<span class="bullet">3</span></a> </li>
<li><a href="#">droid z<span class="bullet">4</span></a></li>
</ul>
</div>

感谢任何想法:)

最佳答案

这可能对你有帮助,因为你是初学者,我想解释一下下面的代码,以便你更好地理解。

  1. 将颜色保存在数组 中。数组的长度必须是您拥有的 li 的数量。
  2. 为所有 li 元素创建一个通用的 click 处理程序。(它已经在您的代码中)
  3. 在点击处理程序中,只需根据点击的 Li 元素的 index 引用数组来更改目标元素的颜色。

    $( function() {
    var xColors =['red','green','yellow','blue'];
    $('.dot li').click( function() {
    $('.wrapper').css('background', xColors[$(this).index()] );
    });
    });

LIve - DEMO

关于jQuery点击改变背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20175316/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com