Jump to content

danishwebindia

Members
  • Posts

    9
  • Joined

  • Last visited

danishwebindia's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. danishwebindia

    CSS3

    <html><head><style>.move, .ball:hover{ animation: animationFrames linear 1s; animation-iteration-count: infinite; transform-origin: 50% 0%; -webkit-animation: animationFrames linear 2s; -webkit-animation-iteration-count: infinite; -webkit-transform-origin: 50% 0%; -moz-animation: animationFrames linear 2s; -moz-animation-iteration-count: infinite; -moz-transform-origin: 50% 0%; -o-animation: animationFrames linear 2s; -o-animation-iteration-count: infinite; -o-transform-origin: 50% 0%; -ms-animation: animationFrames linear 2s; -ms-animation-iteration-count: infinite; -ms-transform-origin: 50% 0%;}@keyframes animationFrames{ 0% { transform: rotate(0deg) ; } 20% { transform: rotate(15deg) ; } 40% { transform: rotate(-10deg) ; } 60% { transform: rotate(5deg) ; } 80% { transform: rotate(-5deg) ; } 100% { transform: rotate(0deg) ; }}@-moz-keyframes animationFrames{ 0% { -moz-transform: rotate(0deg) ; } 20% { -moz-transform: rotate(15deg) ; } 40% { -moz-transform: rotate(-10deg) ; } 60% { -moz-transform: rotate(5deg) ; } 80% { -moz-transform: rotate(-5deg) ; } 100% { -moz-transform: rotate(0deg) ; }}@-webkit-keyframes animationFrames { 0% { -webkit-transform: rotate(0deg) ; } 20% { -webkit-transform: rotate(15deg) ; } 40% { -webkit-transform: rotate(-10deg) ; } 60% { -webkit-transform: rotate(5deg) ; } 80% { -webkit-transform: rotate(-5deg) ; } 100% { -webkit-transform: rotate(0deg) ; }}@-o-keyframes animationFrames { 0% { -o-transform: rotate(0deg) ; } 20% { -o-transform: rotate(15deg) ; } 40% { -o-transform: rotate(-10deg) ; } 60% { -o-transform: rotate(5deg) ; } 80% { -o-transform: rotate(-5deg) ; } 100% { -o-transform: rotate(0deg) ; }}@-ms-keyframes animationFrames { 0% { -ms-transform: rotate(0deg) ; } 20% { -ms-transform: rotate(15deg) ; } 40% { -ms-transform: rotate(-10deg) ; } 60% { -ms-transform: rotate(5deg) ; } 80% { -ms-transform: rotate(-5deg) ; } 100% { -ms-transform: rotate(0deg) ; }}</style><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><script>$(document).ready(function(){$('.ball').hover(function(){ $(this).addClass('move');});});</script></head><body><img src="http://i.imgur.com/ZHf8dsG.png" class="ball"/></body></html> Try this code. It is not possible without js. so I use jquery.
  2. 1em is equal to the current font size. The default text size in browsers is 16px. So, the default size of 1em is 16px.CSS Font - W3Schoolswww.w3schools.com/css/css_font.asp
  3. <div ng-app="" ng-init="a=0;b=0;"> <input type="text" ng-model="a" /> <input type="text" ng-model="b" /> {{(Math.pow(a, b ))}} //Want to value here not in alert// </div> your alert is working
  4. I want to find power i.e a=2; b=3; c=8 in angular js
  5. <div ng-app="" ng-init="a=0;b=0;"> <input type="text" ng-model="a" /> <input type="text" ng-model="b" /> {{c}} </div> <script> $scope.Math=Math; var c=Math.pow (a, b ) ; </script>
  6. div{width:150px; height:100px; background:red; -webkit-animation: myfirst 5s; animation: myfirst 5s;} @-webkit-keyframes myfirst{ from{width:0px;} to{width:150px} } @keyframes myfirst{ from{width:0px;} to{width:150px;} } I think you want like this....
  7. it work when the json file is online. it is not working in local folder. javascript code is fine.
  8. My Customers.JSON file in root folder. its not working. My code is <div ng-controller="personName"> <input type="text" ng-model="test" /> <ul class="list-unstyled"> <li ng-repeat="x in names | orderBy:'Name' | filter:test">{{x.Name+' '+x.City}}</li> </ul> </div> <script type="text/javascript"> function personName($scope,$http){ $http.get('Customers.JSON').success(function(response){$scope.names=response;}); } </script>
×
×
  • Create New...