-
Angularjs 2015‧02‧12
Angularjs - 외부 json 파일 불러와서 dom에 바인딩 시키기
코드 출처 : http://codepen.io/tutorialab/pen/EJAet?editors=101 <div id="wrapper" ng-app> <div ng-controller="DataCtrl"> <pre ng-model="data"> {{data}} </pre> <input ng-model='name' /> {{name}} <input ng-model='salutation' /> {{salutation}} <input ng-model='greeting' /> {{greeting}} </div> </div> 위 처럼 html 을 만든다. angular.module('', []); function DataCtrl($scope, $http) { $http.jsonp("http://angularjs.org/greet.php?callback=JSON_CALLBACK&name=Super%20Hero"). success(function(data) { $scope.data = data; $scope.name = data.name; $scope.salutation = data.salutation; $scope.greeting = data.greeting; }). error(function (data) […]
-
Angularjs 2015‧02‧12
Angularjs - jsonp 불러오기
외부에 있는 json 파일을 불러오는 코드이다. 출처 : http://jsfiddle.net/zkfruxu3/ <div ng-app ng-controller="jsonp_example"> <button ng-click="doRequest()">Make JSONP request</button> </div> 위 처럼 html 안에 버튼을 클릭하면 doRequest 함수가 실행되게 만든다. function jsonp_example($scope, $http) { $scope.doRequest = function() { var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK"; $http.jsonp(url) .success(function(data){ console.log(data.found); }); }; var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK"; $http.jsonp(url) .success(function(data){ console.log(data.found); }); } 외부 파일을 $http.jsonp을 통해 […]
-
Javascript, jQuery, Tools 2015‧01‧26
Javascript - 모바일 브라우저 접속 체크
모바일 기기로 접속하였는지 여부를 확인한 후 개별적으로 링크를 따로 구현하게 될 때가 많다. 특히 모바일웹을 따로 구축하게 되는 경우가 이러한데 모바일이 시대가 흐를수록 다양해지다보니 오래전 스크립트가 제대로 작동되지 않을 때가 있다. 이를 해소해주는 사이트가 있다. http://detectmobilebrowsers.com/ 위 사이트로 이동한 뒤 javascript 파일을 다운 받아 사용하여도 된다. jQuery등 그 외 Apache, ASP, ASP.NET, ColdFusion, C#, IIS, JSP, […]
-
Javascript, jQuery 2015‧01‧26
jQuery - css로 display none와 block에 상태에 따른 처리
css를 이용해서 인터렉션을 구성해 놓은 경우가 있다. 특히나 display : block 과 none를 이용해서 요소를 보이거나 사라지게 하는 상황이 많은데 스크립트로 함수를 만드는 중에 이에 따른 행동이 필요할 때가 있다. if($('.popup').is(":visible")){ // display : none가 아닐 경우 }else{ // display : none일 경우 } .popup 엘리먼트가 가시적으로 보이는지 아닌지에 따른 조건문이다.
-
Javascript, jQuery 2015‧01‧26
jQuery - Ajax로 데이터 불러오기
외부 데이터를 불러올 때 Ajax를 통해서 가져오는 경우가 많다. Ajax를 통해서 Json 형식의 파일을 불러오는 예제를 만들면 아래와 같다. $.ajax({ type: "GET", url: "파일경로및 파일명", dataType: "json", cache: false, success: function(data){ $.each(data.dataList,function(index){ $('li').eq(index).html(data.dataList[index].val); }); },error: function(XMLHttpRequest, textStatus, errorThrown) { console.log("Status: " + textStatus); },timeout: 3000 }); 설명하자면 timeout 에 3000을 입력해둔 것은 외부 데이터를 불러오는 […]
-
Javascript, jQuery 2015‧01‧13
jQuery - 스마트폰 스크린 회전 감지 스크립트
스마트폰의 스크린이 가로모드와 세로모드를 감지하여 필요에 따라 스타일시트나 스크립트를 다르게 사용하는 경우가 있다. 일단 css의 미디어쿼리로 처리하는 방법을 보면 아래와 같다. #cover{ display:none; } @media only screen and (device-width: 768px) and (orientation: landscape) { #cover{ display: block; } } @media only screen and (min-device-width: 320px) and (orientation: landscape) { #cover{ display: block; } } 위 […]
-
Html, CSS 2015‧01‧13
css - 모바일웹 화면 회전시 텍스트 크기가 변경될 때
반응형 웹사이트를 제작하다보면 미디어쿼리를 이용해서 모바일 화면의 폰트 크기를 지정하는 경우가 있다. 그런데 세로로 보는 상태에서 화면을 회전시켜 가로 모드 (Landscape)가 되면 텍스트들이 자동으로 커지는 현상을 발견할 것이다. 픽셀로 정의한 폰트가 아닌 가변적인 치수로 지정할 경우 그러한데 이는 스마트폰의 브라우져가 컨텐츠 정보를 읽기에 최적화된 모드로 렌더링하기 때문이다. 이에 디자인을 기반으로 em이나 %로 폰트 사이즈를 설정한 […]
-
Tools 2015‧01‧07
페이스북 공유시 나오는 정보 수정 방법
일단 페이스북에 주소를 입력하거나 공유하게 되면 나오는 정보들이 있다.이 정보들을 사이트에 설정하려면 아래 링크를 찾아가서 메타 태그를 헤더안에 넣으면 된다. https://developers.facebook.com/docs/sharing/best-practices?locale=ko_KR 그리고 나온 정보가 제대로 반영되지 않을 때는 페이스북 개발툴에서 캐시를 삭제한다. https://developers.facebook.com/tools/debug/og/object/ 위 주소로 접속하면 캐시를 지울 사이트 주소를 입력하는 칸이 나온다.주소를 입력하고 'Show existing scrape information'를 누르면 설정된 값들이 나열 된다. 'Fetch new […]
-
Html, CSS 2015‧01‧06
css3 - 아이폰에서 스크롤이 부드럽지 않고 버벅일 때
overflow:scroll; -webkit-overflow-scrolling:touch; 위와 같이 써주면 스크롤이 자연스럽게 변하게 된다.
-
Php 2015‧01‧06
Mysql-간단하게 테이블과 필드 생성
create table 테이블이름( 필드명A int(10) NOT NULL auto_increment, 필드명B varchar(20), 필드명C int(10), PRIMARY KEY(필드명A)) 필드가 3개인 테이블을 생성하는 방법으로 필드명A는 고유키로 설정하며 자동으로 증가하는 인덱스와 같은 기능으로 사용하려고 설정하였다.