JSFiddle - React, Tailwind, and code Playground

by yonet3d

HTML

<body ng-app="catApp">
    <div ng-controller="CatController">
        <button>Feisty</button>
        <button>Silly</button>
        <button>Cool</button>
        <button>Sleepy</button>
        <img src="http://i.imgur.com/jTGa7.gif" alt="" ng-show="feisty"/>
        <img src="http://img.pandawhale.com/57518-Cat-gif--stop-drop-and-roll--I-ndJz.gif" alt="" ng-show="silly"/>
        <img src="http://img.pandawhale.com/65323-Deal-with-it-cat-gif-Imgur-GRHo.gif" alt="" ng-show="cool"/>
        <img src="http://yarr.me/c/735/23/he-s-a-champ.gif" alt="" ng-show="sleepy"/>
        
    </div>  
</body>

JavaScript

var app = angular.module('catApp',[])
app.controller('CatController',['$scope', function($scope){
    $scope.sleepy = false;
    $scope.feisty=false;
    $scope.silly=false;
    $scope.cool=false;
}])

//Use ng-click directive and create a toggle function in the controller to show and hide the related images.