Kishan
Kishan

Reputation: 388

How to hide the div after sometime in angular or css?

I have one div, initially it is hidden. But on click of the button i am showing it using angular ng-show directive. After showing for 2 seconds i want to hide it. How to do it using angular or css anyone is ok.

HTML code

       <div class="subcontent tinyUrlContainer">
          <span class="slabel col-md-2">WAP Link :</span>
          <div class="input-group col-md-6">
                <input type="text" ng-model="wapLink"  class="form-control">
                <span class="input-group-btn" my-Tooltip>
                    <button type="button" class="btn btn-default" clipboard supported="supported" text="wapLink" ng-click="clipboard=true" on-error="fail(err)"><img class="clippy" src="./images/surveys/tinyUrl.png" width="13" alt="Copy to clipboard" data-pin-nopin="true"></button>
                </span>
          </div>

       </div> 
       <span class="copied col-md-offset-6 col-lg-offset-5  col-md-1" ng-show="clipboard">Copied!</span>

on click of the button am setting the clipboard as true and in .copied class element ng-show="clipboard" am setting.

Upvotes: 0

Views: 4420

Answers (2)

Amygdaloideum
Amygdaloideum

Reputation: 4853

$scope.theClickFunction(){
    $scope.theShowFlag = true;
    $timeout(function(){
        $scope.theShowFlag = false;
    }, 2000);
}

Upvotes: 1

taguenizy
taguenizy

Reputation: 2265

On HTML

ng-show=someCondition()

On your controller

var show = false;
function someCondition(){  
  return show;
}

function onClick(){
   show = true;
   $timeout(function(){ 
       show= false
   }, 2000);
}

Upvotes: 2

Related Questions