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


Tags: angularjs,css3

Problem :

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.



Solution :

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

    CSS Howto..

    How to make border for UL if Li has style “float:left;”?

    CSS element class - Height differs based on content, how to fix?

    How to make submenus have the same width as the menu CSS/HTML5

    How do I make my picture slideshow stay behind my header

    How to set background url for css files in thymeleaf?

    How can i get my Jchartfx area graph to show up underneath my gridview?

    How can I make this kind of a border?

    How do I use pseudo-classes to select all children except first and last?

    How to change the text-color of element after clicking it?

    CSS: how to keep image never modified with same “offset” all the time?

    Responsive portrait images, Hows & Dont's?

    How to make css jQuery thumbnail slides loop

    Jquery Cycle Plugin issue with extending the slideshow “outside” the page boundary

    How CSS property “opacity” renders in browsers (IE, Chrome, Firefox, Opera)?

    How to override Zurb Foundation css properties using rails 3.1?

    Why do the Google Fonts fail to show up on my website?

    How can I line up the two containers in view?

    HTML/CSS — How to add a selected state

    How to get a tight div when heights differ? [duplicate]

    How to use CSS position(relative, absolute) with percentage (height, width) dimension? [closed]

    CSS float: how to form the second row based on tallest DIV?

    How to apply a responsive CSS height to an element using min/max-height and height?

    How to display inline input in li?

    how I can change the size of font inside PHP

    How to style the wp_list_page in wordpress?

    How to pause css animation at orginal state

    How to make show/hide div with a toggle using CSS?

    How to create CSS-based (big) quotation marks?

    How to set ribbon on image by stacking it in a div?

    how to append a css class to an element by javascript?