title: Check if it is tablet or desktop
body: <p>Hi I've got follow code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>angular.module("myApp", []).controller("myController", function($scope) {
    $scope.isShown = false;
  
    $scope.togglePopup = function() {
      $scope.isShown = !$scope.isShown;
    }
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: grey;
  }
  .inputAddon {
    display: flex;
    flex-direction: row;
  }
  input {
    width: 75px;
    height: 19px;
  }
  .addon {
    width: 25px;
    height: 25px;
    background-color: green;
  }
  .popup {
    width: 200px;
    height: 200px;
    border: 1px solid red;
    background-color: white;
    position: absolute;
    z-index: 1000;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"&gt;&lt;/script&gt;
  
  &lt;div ng-app="myApp" ng-controller="myController" class="wrapper"&gt;
    &lt;div class="inputAddon"&gt;
      &lt;input type="number"&gt;
      &lt;div class="addon" ng-click="togglePopup()"&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="popup" ng-if="isShown"&gt;&lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>There you can see an input with a addon-button on the right side, which is opening something like a popup with more actions in it. Now it should work like this:</p>
  
  <ul>
  <li><strong>Desktop:</strong> Click in input field = focus in input field and type value with keyboard. Click on addon-button (green one) = opens the popup.</li>
  <li><strong>Tablet:</strong> Addon-button (green one) hidden. Click in input = don't open the costume keyboard of the browser (for example the virtual keyboard in safari from ipad). It opens the popup like the addon-button (green one) on desktop.</li>
  </ul>
  
  <p>So I need a way to detect, if there is a tablet or desktop. When it's a tablet, I had to add the property <code>readonly="true"</code> to the input. This would not open the costume keyboard on a tablet. Also a need to hide the addon-button and open the popup when I click in the input. On the desktop it should work like in the snippet.</p>
  
  <p>I know how to add/remove <code>readonly</code> and how to hide/show adddon-button with Jquery, Javascrpt etc. But what't the best way to detect if it't tablet or desktop? I found some questions with <code>$.browse</code> but I read, that it's not supported anymore sinse Jquery 1.9.1? Or is there also a way to do this with angular?</p>
  
  <p>Any ideas/informations about this?</p>
  
  <p>Thanks.</p>