We can make use of Angular directives to make use of this functionality. AngularJS provides ng-init, ng-mouseover, ng-mouseout.
Program Flow
- ng-init : Initiate image source in a variable
- ng-mouseover : Assign new image source to the variable
- ng-mouseout : Assign original image source to the variable
- ng-src : Give that variable name in ng-src of img
Program
<div id="divID" ng-init="imgsrc='/images/twitter_blue.png'" ng-mouseover="imgsrc='/images/twitter_brown.png'" ng-mouseout="imgsrc='/images/twitter_blue.png'"> <img ng-src="{{imgsrc}}"/> <div>Image description</div> </div>
Nice 1, helpfull
ReplyDeletenice one, when put mouse over part of image, how to do?
ReplyDeleteNice one, very helpful
ReplyDeletegoo
ReplyDeletebut i neet in angular 9