IT 관련 47

JQuery로 별과 도표 만들기

별과 도표(서울시장 득표율) 를 만들어 보자 [소스] script src='http://code.jquery.com/jquery-latest.js'> $(document).ready(function() { var ctx = $('#mycanvas')[0].getContext('2d'); //연필로 그리기 (별만들기) ctx.beginPath(); ctx.moveTo(100, 100); ctx.lineTo(200, 100); ctx.lineTo(110, 160); ctx.lineTo(150, 70); ctx.lineTo(180, 160); // 시작 선을 서로 연결해 준다. closePath ctx.closePath(); ctx.stroke(); ctx.beginPath(); // x좌표, y좌표, 반지름..

IT 관련/Html5 2011.11.03

JQuery Canvas를 이용한 무지개 만들기

JQuery를 이용하여 무지개를 만들어 보도록 하자 Canvas는 포토샵의 Layer개념으로 봐도 된다. .gamelayer { position: absoulte; top : 0px; left : 0px; } $(document).ready(function() { var canvas = $('#mycanvas')[0]; var ctx = canvas.getContext('2d'); // 무지개 만들기 //fillRect(x좌표, y좌표, 가로크기, 세로크기) ctx.fillStyle = 'rgb(255,0,0)'; ctx.fillRect(0, 0, 50, 100); ctx.fillStyle = 'rgb(255,100,0)'; ctx.fillRect(50, 0, 50, 100); ctx.fillStyle ..

IT 관련/Html5 2011.11.03

웹사이트 소스 가져오기 (JSON, Ajax)

JSON을 이용하여 밑단을 제어해보도록 해보자 샘플로 쓸 주소는 네이버 모바일 네이버의 소스를 Get방식과 Post방식으로 불러와서 textArea에 집어 넣는다. function download_get() { // 이미 세팅된 네이버 모바일의 주소를 가져옴 var str_url = $('#input_url').val(); // 네이버 모바일의 소스를 가져와 textArea에 삽입 var jqxhr = $.get(str_url, function(data) { $('#textvw').val(data); }); } function download_post() { // 이미 세팅된 네이버 모바일의 주소를 가져옴 var str_url = $('#input_url').val(); // 네이버 모바일의 소스를 가져..

IT 관련/Html5 2011.10.28

JSon을 이용한 플리커 이미지 가져오기

[플리커의 오픈 API] http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?tags=soccer&tagname=any&format=json tags = 에 검색하고자 하는 값을 넣음 (soccer - 축구) [검색결과] ({ "title": "Uploads from everyone", "link": "http://www.flickr.com/photos/", "description": "", "modified": "2011-10-28T11:01:18Z", "generator": "http://www.flickr.com/", "items": [ { "title": "DSCN0286", "link": "http://www.flickr.c..

IT 관련/Html5 2011.10.28

보안카드 관리 어플 (OneLock)

개인적으로는 아이폰 필수 어플이다. 불필요하게 보안 카드를 가지고 다니지 않더라도 아이폰만 있으면, 언제 어디서든지 보안카드 번호를 확인 할 수 있다. 보안카드 전용 어플은 아니고, 여러가지 카드 및 라이센스 번호를 등록할 수 있지만, LITE버전이기에 10개까지 밖에 등록이 되지 않기 때문에 보안카드가 많으면 보안카드 위주로 등록해서 사용하면 된다. 자 이제 사용해보자 보안을 위해 시작시 비밀번호를 걸어주는 건 필수 다양한 카테고리 별로 카드를 입력한다. 필요한 보안카드를 은행별로 미리 등록을 해 놓으면 된다. 주의할 점은 반드시 한번의 진짜 보안카드와의 맞는지 확인이 필요하다. iPhone 에서 작성된 글입니다.

JQTouch 활용

jqtouch/jqtouch.css를 보면 활용 가능한 목록을 볼 수 있다. 사용시(body부분에서) 아이디가 jqt아래로 들어가야 된다. ... jqtouch.js를 보면 사용 가능한 애니메이션을 볼 수 있다. (selector로 된부분을) html파일에서 class='cube'로 하여 사용할 수 있다. [자 그럼 이제 코딩을 해보자] 이건 그냥 복사해서 쓰자 ---------------------------------------------------------------------------------------------------------- var jQT = $.jQTouch({ icon: 'kilo.png', statusBar: 'black' }); $(function(){ // Custom ..

IT 관련/Html5 2011.10.14

JQuery 활용

class 가 toolbar이면 이미 세팅된 JQuery에 의해 toolbar의 디자인이 입혀진다. head부분의 스크립트는 가져다 쓰면 되고, 이 부분만 있으면 기본은 해결 된다. JQuery에서는 아이디 앞에 항상 #이 붙는다. 으로 링크를 걸어주면 로 자동으로 화면 전환을 해준다. class명에 button back로 설정해 놓으면 자동으로 back버튼이 생성되고, 링크는 #으로 한다. class에 button flip은 좌우로 돌면서 화면이 전환된다. li에 class ='arrow'를 주게 되면 오른쪽에 화살표가 붙는다. --------------------------------------------------------------------------------------------------..

IT 관련/Html5 2011.10.13

JQuery에 대하여

JQuery라 해서 자바스크립트에서 사용하는 SQL Query인줄 알았다. 하지만 아니었다. ㅠ.ㅠ 향상된 페이지를 위한 플러그 인 (JQTouch) - 자바스크립트 라이브러리라 보면 된다. JQuery의 장점 - 복잡하게 사용하던 함수를 쉽게 사용할 수 있다. [자 그럼 비교해 보자] ------------------------------------------------------------------------------------ function sayHello() { document.getElementById('foo').innerHTML = 'hi there'; } click me ----------------------------------------------------------------..

IT 관련/Html5 2011.10.13
반응형