如何使用jquery添加对称值

Luk*_*kas 1 javascript css jquery symmetric

我有这个标记:

<div class="container">
   <figure></figure>   
   <figure></figure>
   <figure></figure>
</div>
Run Code Online (Sandbox Code Playgroud)

现在:我需要为每个figures对称元素添加,但具有不同的高度和宽度值.对于下一个项目,我需要删除大约10%的宽度和高度.因此,第一个具有90%,第二个具有80%,第三个具有70%的初始尺寸.我使用以下代码,但它不起作用,有人可以帮忙吗?

var inside_element = $(figure);
var indx = 10;
inside_element.each(function(indx){
    $(this).css({
        width: '90%' - indx,
        height: '90%' - indx
    });
});
Run Code Online (Sandbox Code Playgroud)

谢谢.

Kas*_*syx 6

您正在处理字符串'90%'并尝试完成数学运算,这将会下降.这应该工作:

var inside_element = $('figure');
var indx = 10;
inside_element.each(function(indx){
    $(this).css({
        width: (90 - (10*indx)) + '%' ,
        height: (90 - (10*indx)) + '%'
    });
});
Run Code Online (Sandbox Code Playgroud)

var indx = 10;没有必要声明.内部函数将覆盖此值.

编辑:也可以有更多的容器.然后代码应如下所示:

var inside_container = $('.inside_container');
    inside_container.each( function(i) {
    var inside_element = $(this).find('figure');
    var step = 10;
    inside_element.each(function(indx){
        $(this).css({
            width: (90 - (step*indx)) + '%' ,
            height: (90 - (step*indx)) + '%'
        });
    });
});
Run Code Online (Sandbox Code Playgroud)