通过增加Dart语言中的z索引来旋转？

我正在尝试使用Dart语言实现旋转木马，将多个Div放置在父Div中。单击右键时，下一个Div的z索引必须高于上一个Div，以便显示它。我已将所有divs类名存储在arraylist中。现在谁能帮我完成这项工作？？ HTML

<div class="carousel">
  <div class="galleryCars">
  ....
  </div>
  <div class="galleryCars2">
  ....
  </div>
  <div class="galleryCars3">
  ....
  </div>
  <div class="galleryCars4">
  ....
  </div>
</div>

....
....
....
....

飞镖

import 'dart:html';
import 'dart:core';
void main(){
    query(".rightArrow img").onClick.listen((e) => cssRightArrow());
    query(".leftArrow img").onClick.listen((e) => cssLeftArrow());
}
cssRightArrow(){
  var carousel = query(".carousel");
  var classList = [];
  carousel.children.forEach(
      (childElement) => childElement.classes.forEach(
          (className) => classList.add(className)
          ));

  /*for (var i = 0; i < classList.length; i++) {                
    var zIndexElem = query(".${classList[i]}");
    var newIndex = int.parse(zIndexElem.style.zIndex ) + 10 ;   
    zIndexElem.style.zIndex = "${newIndex}";
    }*/ //Not Working
}

导入'dart:html'；
导入“省道：核心”；
void main（）{
query（“.rightArrow img”）.onClick.listen（（e）=>cssRightArrow（））；
query（“.leftArrow img”）.onClick.listen（（e）=>cssLeftArrow（））；
}
cssRightArrow（）{
var carousel=查询（“.carousel”）；
var classList=[]；
儿童旋转木马(
（childElement）=>childElement.classes.forEach(
（className）=>classList.add（className）
));
/*对于（var i=0；i

这里是一个使用

style.display='none'

而不是

zIndex

的工作示例（我认为

zIndex

不适合此用例）：

导入'dart:html'；
void main（）{
query（“.rightArrow img”）.onClick.listen（（e）=>cssRightArrow（））；
query（“.leftArrow img”）.onClick.listen（（e）=>cssLeftArrow（））；
}
cssRightArrow（）{
最终元素=查询（“.carousel”）。子项；
//正在查找当前显示的
最终元素当前=elements.firstWhere（（e）=>e.style.display！='none'）；
最终currentIndex=元素。indexOf（当前）；
//隐藏当前并显示下一个
if（当前索引+1<元素长度）{
current.style.display='none'；
元素[currentIndex+1]。style.display=''；
}
}

final Element current=elements.firstWhere（（e）=>e.style.display！='none'）；在这里我需要再做一个绝对姿势。如何放置事件调用？？？

style.display

（用于显示类型）和

style.position

（用于

绝对

定位）是可以独立设置的

style

的两个不同属性。