在json文件的图像上添加ng-mouseover

时间:2016-10-27 18:15:23

标签: javascript angularjs json

我有以下代码:

<div class="container" ng-controller="ListCtrl">
<div class="col-md-2-4" ng-class="{'div-hide': index  > $index + 1}" ng-repeat="question in questions">
  <div>{{question.qid}} {{question.question}} </div>
    <div class="row">
      <div class="col-lg-3 col-md-4 col-s-6 thumb" ng-repeat="image in question.images">
                    <div ng-mouseover="style={'background-color':'gray','cursor':'pointer'}">                   
                        <img class="img-responsive " id="{{image.imageid}} " src="{{image.imgpath}} " alt=" " >
                    </div>
                </div>

            </div>


        </div>
        <div class="keys">
            <button type="button " class="btn btn-next " ng-click="index=index < questions.length ? index + 1 : questions.length ">Next</button>
            <button type="button " class="btn btn-pre " ng-click="index=index> 1 ? index - 1 : 1">Previous</button>
      {{index}}
    </div>
</div>

在img标签中,我添加了一个鼠标,这样当鼠标移过图像时,它会产生灰色背景等,但它不起作用。有谁知道为什么?

UPDATEE

所以我编辑了它并尝试将css添加到div中,但这似乎也不起作用..继续更新的plunker .. http://plnkr.co/edit/DqNRnc8xYZn73vdkWjaG?p=preview请有人帮忙!

1 个答案:

答案 0 :(得分:0)

将此添加到您的CSS:

#imgbutton:hover, #imgbutton:active {
  background-color: gray;
}

这使用CSS来定义悬停样式。