我想创建一排div,每个div的背景色都比前一个要高一些。创建一种渐变。



为了为每个div生成不同的不透明度,我创建了一个使用该div的ID的变量。但这并没有带来任何有用的结果。可悲的是,在不了解所有基础知识的情况下承担过多的责任。

$(document).ready(function(){

    $("div").each(function(index, value) {

        var ids = $(this).attr('id');
        var opa = ids/10

        $("div").css("background-color", "rgba(255, 255, 255, "+opa+")");

    });

});


谢谢您的帮助!

最佳答案

你快到了!分配背景色时,$("div")应该为$(this),因为您不想在所有元素上都设置它,而只能在当前元素上设置它。



$(function(){

    $("div").each(function(index, value) {
        var ids = $(this).attr('id');
        var opa = ids/10;

        $(this).css("background-color", "rgba(255,255,255, "+opa+")");
    });

});

body {
  background-color: #000;
}

.box {
  display: inline-block;
  width: 50px;
  height: 100px;
}

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

<div class="box" id="1"></div>
<div class="box" id="2"></div>
<div class="box" id="3"></div>
<div class="box" id="4"></div>

10-05 20:39
查看更多