我需要一個幫助。我需要將圖像放大/像放大,而鼠標懸停在特定的圖像。我正在解釋我的代碼如下。如何讓鼠標懸停在使用Angular.js圖像更大
<div ng-repeat="mul in mulImage">
<div class="input-group bmargindiv1 col-md-12">
<span class="input-group-addon ndrftextwidth text-right" style="width:180px">Image{{$index+1}}:</span>
<input type="file" class="filestyle form-control" data-size="lg" name="upload_{{$index}}" id="bannerimage_{{$index}}" ng-model="mul.image" ngf-pattern="'image/*'" accept="image/*" ngf-max-size="2MB" ngf-select="onFileSelect1($index);">
<span class="input-group-btn" ng-show="mulImage.length>0">
<img ngf-thumbnail="mul.image" name="pro" border="0" style="width:32px; height:32px; border:#808080 1px solid;" ng-if="mul.image !=null"><img ng-src="upload/{{mul.filename}}" name="pro" border="0" style="width:32px; height:32px; border:#808080 1px solid;" ng-if="mul.filename!=''">
<input type="button" class="btn btn-success" name="plus" id="plus" value="+" ng-click="addNewImageRow(mulImage);" ng-show="$last"> <input type="button" class="btn btn-danger" name="minus" id="minus" value="-" ng-show="mulImage.length>1" ng-click="deleteNewImageRow(mulImage,$index);">
</span>
</div>
</div>
我在這裏通過使用+
button.My控制器側代碼下面給出創建新文件字段選擇所述多個圖像。
$scope.mulImage=[];
$scope.mulImage.push({'image':null,'filename':''});
console.log('mulimage',$scope.mulImage);
$scope.addNewImageRow=function(mulImage){
console.log('total image',mulImage.length);
mulImage.push({'image':null,'filename':''});
console.log('end total image',mulImage.length);
}
$scope.deleteNewImageRow=function(mulImage,index){
mulImage.splice(index,1);
console.log('file',$scope.mulImage);
}
$scope.onFileSelect1 = function(index) {
$scope.mulImage[index]['filename']='';
}
在這裏,我從驅動器中選擇圖像後,需要同時用戶將鼠標懸停時的圖像上的圖像將變得更大,並且用戶將鼠標移出再次圖像會出來原來position.Here是我plunkr working code。請幫我解決這個問題。
請參閱此鏈接。類似於這個que.Its所有相關的CSS http://stackoverflow.com/questions/42219844/hover-not-working-and-i-dont-know-Why – Mohammed
@Akash瑞安索恩應該工作。 – Nirus