Question

我对jquery完全不熟悉（截至今天我刚刚参加了关于jquery的代码学院课程）。我正在尝试制作图像滑块。我觉得我有工作的想法，但我缺少一些基本的东西。我希望它只是无限运行所以我将它设置为在页面打开时连续运行。谁能帮我吗？我在css中将所有5个图像的不透明度设置为0，并尝试使用我编写的jquery函数更改它。

我知道我可以用css中的关键帧来做到这一点。我非常精通CSS。我只是想在这一点上掌握javascript和jquery。看看：

$(document).ready(function(){
  var img = $('.slides');
  for(i = 0; i <= $img.length; i++){
    $img[i].style('opacity', 1);
  };
});

/*gallery row*/
  .img-slider-container{
    margin: 10% 10%;
 }
    /*gallery list*/
    .image-list{

    }
    .image-list li{
      list-style: none;
      display: inline-block;
    }
    .image-list li img{
      display: block;
      width: 15em;
      opacity: 0;
    }
    /* gallery container */
    .img-slider{
      width: auto;
    }

<section class="img-slider-container row">
  <div class="col-12 img-slider">
    <ul class="image-list">
      <li><img src="design/images/portfolio-images/one.jpg" class="slides" alt=""/></li>
      <li><img src="design/images/portfolio-images/two.jpg" class="slides" alt=""/></li>
      <li><img src="design/images/portfolio-images/three.jpg" class="slides" id="starting-image" alt=""/></li>
      <li><img src="design/images/portfolio-images/four.jpg" class="slides" alt=""/></li>
      <li><img src="design/images/portfolio-images/five.jpg" class="slides" alt=""/></li>
    </ul>
  </div>
</section>

Answer 1

使用$scope.all_forms = []; $scope.addNewMarker = function(e) { var form = '<div id="form_canvasform" >' + '<form name="form_canvas">' + '<textarea class="form-control" required placeholder="Your Text..." ng-model="mk[$scope.all_forms.length].text">{{all_forms}}</textarea><br/>' + '<button class="btn btn-default" ng-click="uploadNewImageMap()" ng-model="mkimage" id="markerJs">Upload Image</button>' + '<button class="btn btn-default" ng-click="uploadNewVideoMap()" ng-model="mkvideo" id="markerJs3">Upload Video</button><br/>' + '</form>' + '</div>'; var form_compiled = $compile(form)($scope); $scope.all_forms.push(form_compiled); all_infoWindow[markerCounter] = new google.maps.InfoWindow({content:$scope.all_forms[$scope.markerCounter][0]}); all_markers[markerCounter] = new google.maps.Marker({position: e.latLng, map: map, draggable:true}); infoWindow.open(map,marker); // not infoWindow.open(app,marker); google.maps.event.addListener(infoWindow,'closeclick',function(){ marker.setMap(null); }); google.maps.event.addListener(marker, 'position_changed', function() { if(infoWindow.getMap()){ infoWindow.open(map,this); } }); $scope.markerCounter += 1; }无限地运行您的脚本。而且您还错误地定义了setInterval它应该是$img。所以，试试类似：

$(img)

用jquery制作图像滑块

1 个答案: