'2016/12/16'에 해당되는 글 4건

  1. 2016.12.16 [Bootstrap] Input 태그의 Clear 버튼
  2. 2016.12.16 [FONTAWESOME] icon 제공 라이브러리
  3. 2016.12.16 [BOWER] Proxy 설정
  4. 2016.12.16 [NPM] Proxy 설정

Bootstrap 의 Input 태그 사용시 아래와 같이 입력한 text를 지우는 기능을 넣는 방법에 대한 코드


HTML

});

CSS

::-ms-clear {
  display: none;
}
.form-control-clear {
  z-index: 10;
  pointer-events: auto;
  cursor: pointer;
}

JavaScript

$('.form-control').on('input change', function() {
  var $this = $(this);
  var visible = Boolean($this.val());
  $('.form-control-clear').toggleClass('hidden', !visible);
}).trigger('propertychange');

$('.form-control-clear').on('click', function() {
  $('.form-control').val('').trigger('change').focus();
  $(this).toggleClass('hidden', true);
});


Reference: https://codepen.io/frosdqy/pen/grbxGW



Posted by leechwin

fontawesom 라이브러리는 HTML 파일내에서 알려진 특정 아이콘을 사용하기 쉽게 제공한다.

라이브러리를 다운로드 받아 사용하지 않고 CDN을 사용하려면 다음 주소를 사용하면 된다.


아래의 아이콘리스트중 사용하고 싶은 아이콘이 있다면 <i> 태그안에 class 속성으로 아이콘 이름을 넣어주면된다.

예제

  • <i class="fa fa-bus" aria-hidden="true"></i>

fontawesome의 <i> 태그는 Bootstrap 을 이용하고 있다면 <span> 태그를 대체 가능하다.

  • <span class=glyphicon glyphicon-remove"></span>


Posted by leechwin

[BOWER] Proxy 설정

Node.js 2016.12.16 11:01

bower install 실행시에 Proxy 환경일 경우 제대로 설치가 안되는 경우가 있다.


이때에는 bower.json 파일이나 .bowerrc 파일에 Proxy 설정이 필요하다.


예제

  • {
      "proxy": "http://yourProxy:yourPort",
      "https-proxy": "http://yourProxy:yourPort",
      "strict-ssl": false,
      "directory": "bower_components",
      "registry":"http://bower.herokuapp.com"
    }
만약 bower install 명력이 동작안하는 경우 bower.json 파일을 .bowerrc 로 변경해서 bower install 을 수행하여 본다.

bower.json 은 최신 bower버전에서 도입되어 구버전의 bower일 경우 인식안되는 경우가 있다.


Posted by leechwin

[NPM] Proxy 설정

Node.js 2016.12.16 10:59

npm install 실행시에 Proxy 환경일 경우 제대로 설치가 안되는 경우가 있다.


이때에는 다음과 같이 npm config 명령을 통해 Proxy 설정이 필요하다.


예제

  • npm config set proxy http://111.111.111.111:8081
  • npm config set https-proxy https://111.111.111.111:8081
  • npm config set strict-ssl false
  • npm config set registry http://registry.npmjs.org/

npm 설정값은 다음 명령으로 확인가능하다.

  • npm config list
설정된 값은 ~/.npmrc 파일에 저장되어 있다.


Posted by leechwin
TAG nodejs, npm, proxy