콩바구니의 그림일기

이 글은 콩바구니님의 2009년 5월 8일에서 2009년 5월 30일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/851 관련글 쓰기

댓글을 달아 주세요

이 글은 콩바구니님의 2009년 4월 24일에서 2009년 5월 6일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/850 관련글 쓰기

댓글을 달아 주세요

  • 오늘 완성한 만화 묘량의 시대 : 인간의 유적 2화 올렸지요. 네이버 도전만화에도 올렸구요. 별점좀 주세요. 굽신굽신(고양이 만화 연재)2009-03-18 21:58:54
  • 와콤 타블릿 리눅스용 공식드라이버, 리눅스용 포토샵, 리눅스용 페인터가 있다면. 윈도우따위 지워버릴텐데… ㅠㅠ(블루스크린 윈도우 정말 싫지만)2009-03-19 16:06:33
  • 오랫만에 플레이톡에 들어가봤다. 웹표준 무시하는것은 여전하더라. 요소검사를 해보니, 쓸대없는 마크업이 범람하고 있다, CSS로 처리해도 되는 것을 인라인 스크립트로 해결하고, 하이퍼링크를 A태그 없이 onclick 으로 구현하고. 가관이다.(웹표준 무시하는 플레이톡)2009-03-20 14:54:22
  • >미투데이의 마크업은 플톡과 비교해서 어떤가 궁금해서 요소검사를 잠시 해봤다. 웹표준 준수와 접근성. 매우 양호했다. 한가지 아쉬운점은, 표현을 위한 div 가 좀 많이 쓰이고 있다는점. 왜 UL 이나 OL 같은 마크업은 사용하지 않는것일까?(미투데이 웹표준)2009-03-20 15:04:09
  • 표현을 위한 마크업을 사용하지는 않았는가? 유의미한 마크업을 사용했는가? 마크업을 본래 목적에 맞게 사용했는가? 웹페이지의 구조는 이해하기 쉬운가? class 와 ID 는 적절하게 사용하였나?(심심하면 살펴보는 HTML 마크업 검사 웹표준)2009-03-20 15:22:35
  • 웹표준 준수하는 하드코딩(표현 구조 동작이 완전히 분리된 아름다운 XHTML문서 생산)가능"하고, PHP도 조금 알고, 자바스크립트도 좀 하고, 그림도 조금 그릴줄알고,가끔 만화도 그리고 포토샵 능숙하고, 혈액형은 A형이고, 실험음악 좋아하고, 요즘은 장기하가 붐이고(자기소개 웹표준 하드코딩 자바스크립트 CSS 만화 그림 포토샵 혈액형 장기하 음악)2009-03-20 15:41:03
  • /1981.03.28 / 29 / 웹디자인 알바하는 만화가 지망생 / 176cm / A형 남자.(자기소개)2009-03-23 15:36:45
  • 봉지라면을 5봉 구입했다. 오랬만에 뽀글이를 해먹을까 생각중. 라면과 같이 구입한 캐반디시 박하사탕을 한개 꺼내 씹어먹었다. 코가 뻥 뚫린듯 시원한 기분. 어금니에 끼인 사탕찌꺼기를 빨아먹는다.(간식 라면 박하사탕)2009-03-23 16:12:48
  • 체질과 비만도 검사 조금 살찐 편이네요. 늦기 전에 운동을 시작하세요. 그리고 당신의 평균 몸무게는 68.1 입니다. ->파이어폭스에서는 안되는군요..(체질 비만도 검사)2009-03-23 16:25:52
  • 소년과 아저씨의 차이점: 가지고 노는 장난감의 가격.(소년에서 아저씨로)2009-03-23 17:10:29

이 글은 콩바구니님의 2009년 3월 18일에서 2009년 3월 23일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/843 관련글 쓰기

댓글을 달아 주세요

이 글은 콩바구니님의 2009년 2월 13일에서 2009년 2월 18일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/841 관련글 쓰기

댓글을 달아 주세요

  • 닌텐도 같은 것 개발 못하나고 하는 2MB. 그런데, 2MB이 강조하는 무한경쟁 교육체제 에서 공부한 학생은 죽었다 깨어도 닌텐도 같은거 절대 못만든다. 지금 대한민국의 학생들에게 게임소프트 개발에 필요한 창의력을 발굴 육성할 시간따위가 있는가?(이명박 닌텐도 개발 이뭐병)2009-02-05 22:11:24
  • 26인치 외발자전거완전분해 해서 락카 떡칠을 했다. 빨간색. 노란색. 하얀색. 번갈아가며 뿌렸다. 나름 주제는 화염. 달빛 아래에서 완성한 자전거 도색의 자태가 어떠할지 내일이 기대된다. (그러고보니 락카란 물건을 사용해보는것은 29년 평생 오늘이 처음이다.)(외발자전거 락카 도색)2009-02-07 00:48:41
  • 자동으로 목차를 생성하는 자바스크립트 를 만들어 보았다.이번것은, ol 과 ul 을 이용하여 유의미한 목차를 생성한다는것과, 생성된 목차를 열고 닫을때 움직이는 효과가 있다는것이 특징이다.(자바스크립트 자동 목차 생성 웹프로그래밍 웹표준)2009-02-08 02:12:58
  • > 옜날 피 지배층 백성은 성이 없었고, 귀족 및 왕족만 성이 있었는데, 이조 말기 상놈들이 몰락양반의 족보를 돈주고 사서 양반이 되면서, 성을 가지게 되었고… 여차저차하여 전국민이 성을 가지게 되었는데, 이조말기 잘나가는 성씨가 김가 이가 박가라…(댓글에 계속)(한국사람 이름 석자 이유 고찰)2009-02-08 03:06:33
  • 자바스크립트로 카드게임 만들었다. 이번에 만든것은 DB와 연동하여 순위 등록도 가능하다. 난이도 선택도 된다.(자바스크립트 카드 뒤집는 게임 웹표준)2009-02-08 22:19:25
  • 자바스크립트로 만든 카드게임을 여러분의 사이트에 설치하세요. 맘에드는 카드로 얼마든지 바꿀수 있고, 카드의 겟수도 제한이 없습니다. DB와 연동하여 순위도 기록됩니다. (왠지 광고같다…)(자바스크립트 카드 뒤집는 게임)2009-02-10 04:39:43
  • 자바스크립트 카드게임 몇가지 수정사항. 간단한 댓글을 남길수 있게 되었고, 자신의 홈페이지에 이 카드게임을 설치한후 기록을 남기면, 사용한 카드중 한장이 게임이 설치된 URL 의 하이퍼링크로 작성되어 순위페이지에 남는다.(자바스크립트 카드 뒤집는 게임)2009-02-10 23:12:55
  • 자바스크립트로 구현한 도트 드로잉 완성. php와 연동하는 작업은 아직이지만.. 오늘은 여기까지. ㅎㅎ(자바스크립트 도트 드로잉)2009-02-12 06:29:39
  • 자바스크립트 도트 드로잉에 오늘 추가할 기능. 1. 확대 축소 기능. 2. 임시저장기능(쿠키사용) 3. 페인트버켓 툴 추가. (실현가능성 1번:90%, 2번:100%, 3번:50%)(자바스크립트 도트 드로잉)2009-02-12 13:28:05
  • 이 도트찍는 자바스크립트에서 완성한 그림의 정보는, 각각 픽셀에 대한 16진수 RGB값의 2차원배열로 저장되는데, 이 컬러값만 가지고 비트맵 그림파일을 생성할수 있으면 좋겠다고 생각했다. 그런데, 그림파일 만드는 알고리즘을 모른다. ㅠㅠ 그게 php로 가능한지도.(자바스크립트 도트 드로잉 bmp gif 저장)2009-02-12 13:41:21

이 글은 콩바구니님의 2009년 2월 5일에서 2009년 2월 12일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/840 관련글 쓰기

댓글을 달아 주세요

이 글은 콩바구니님의 2009년 1월 26일에서 2009년 2월 2일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/839 관련글 쓰기

댓글을 달아 주세요

본문중에 특정 단어를 걸러내서 괄호를 치는 스크립트를 만들어 봤습니다.

예문

동해물가 백두산이 마르고 닳도록 하느님이 보우하사 우리 나라 만세

<script type="text/javascript">
function addLoadEvent(func) {
    var oldonLoad = window.onload;
    if (typeof window.onload != 'function') {
            window.onload = func;
    }else {
        window.onload = function(){
            oldonLoad();
            func();
        }
    }
}
addLoadEvent(wordHighlighting);
function wordHighlighting () {
    var Hwords = new Array("동해물","백두","하느님");   
    var body_el = document.getElementsByTagName("body")[0];
    var all_el = body_el.getElementsByTagName("*");
    var txtParents = new Array();
    var cnt = 0;
    for (var i=0; i<all_el.length; i++){
        if (all_el[i].nodeName == "LI" || all_el[i].nodeName == "TD" || all_el[i].nodeName == "P"
        || all_el[i].nodeName == "SPAN" || all_el[i].nodeName == "STRONG" || all_el[i].nodeName == "INS"
        || all_el[i].nodeName == "EM"){
            if (all_el[i].childNodes[0].nodeValue){
                txtParents[cnt] = all_el[i];
                cnt++;       
            }
        }   
    }
    for (var i=0; i<Hwords.length; i++){
        for (var j=0; j<txtParents.length; j++){
            var txt = txtParents[j].childNodes[0].nodeValue;
            if (txt == Hwords[i]){
                txtParents[j].className = "highlight";
            }
            if (txt.length > Hwords[i].length){
                for (var t=0;t<txt.length-Hwords[i].length;t++){
                    var tmp = txt.substring(t,t+Hwords[i].length);
                    if (tmp == Hwords[i]){
                        var before = txt.substring(0,t);
                        var after = txt.substring(t+Hwords[i].length,txt.length);
                        var texts = document.createTextNode(before + "[" + tmp + "]" + after);               
                        txtParents[j].removeChild(txtParents[j].childNodes[0]);
                        txtParents[j].appendChild(texts);
                    }
                }
            }
        }
    }
}
</script><noscript>텍스트 하이라이팅</noscript>

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/813 관련글 쓰기

댓글을 달아 주세요

지난번에 만들었던것 에서 여러가지 요소를 추가하여 0.2버전입니다.
카드의 위치를 기억한다음 시작하기 버튼을 누르면 게임을 시작합니다.
전부 15쌍의 카드를 찾으면 게임 끝입니다.
카드를 뒤집은 횟수와 경과시간을 알수 있습니다.

이 게임은 자바스크립트를 사용합니다. 자바스크립트를 사용하지 못하는 브라우저는 이 게임을 진행할수 없습니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/810 관련글 쓰기

댓글을 달아 주세요

  1. 진태완 2009/03/18 11:15  댓글주소  수정/삭제  댓글쓰기

    헉..여기도있었네요;근데여기는
    시작하기 누르기 전에 카드모양이 보여서,
    쉽게10번만에 다 풀었어요;
    아까는 90번에 다 풀었는데 ㅎㅎ//

    이 전것이 더 효과적인 암기방법일듯;
    ㅎㅎ...

자바스크립트로, 카드게임을 만들어 봤습니다.
같은카드가 2쌍씩 존재하는 여러장의 카드를 섞어서, 두장씩 뒤집으며 같은 카드를 찾는 게임입니다. 한장 뒤집을때마다 숫자를 새기때문에, 기록경쟁을 할수도 있습니다.
저는 84번이 최고기록이네요.

카드카드카드카드카드카드카드카드카드카드카드카드카드카드카드카드
Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/808 관련글 쓰기

  1. Subject: 콩바구니의 알림

    Tracked from kongbaguni's me2DAY 2008/10/10 01:35  삭제

    자바스크립트로 구현한 카드 게임 리눅스에서 블루피쉬로 코딩했다지요. 책도 안보고, 가끔 인터넷 검색찬스 쓰면서 만들었지요. 이런거 만들줄 아는게 대단한건지는 모르겠지만. 아무튼, 브라우저 안가리고 제대로 동작하는 자바스크립트 게임 만들줄 아는사람 별로 없겠지요?

댓글을 달아 주세요

  1. 진태완 2009/03/18 11:09  댓글주소  수정/삭제  댓글쓰기

    카드짝맟추기게임잘보고,잘해봤읍니다.
    요세 , 저도 카드맟추기 게임을 자바로 만들고 있는데
    많은 도움이 된거 같읍니다.
    근데
    브라우저 안가지고 제대로 동작하는 자바스크립트 게임 을
    만드셨다고 하셔서 또 다른 숙제를 만들어주신것 같은데요,
    그 고민은, 생각은 안해봤읍니다.
    웹이나 다른 java 어플리케이션에서 돌아가면 된다고 생각했는데요, 콩바구니 님 의 카드작품을 실행해보고,
    조금 더 공부하면서 만들어야겠다는 생각이 참많이 들었읍니다.

    일기?비슷한 글을 보아하니, 매일같이 블로그를 만지시는것 같아 이렇게 댓글을 달아 봅니다.

    제가 공부하는데 조금이나마 공부에 도움을 달라고 이렇게 청해봅니다.

    솔직히,
    소스는 소스보기로 해서 봤읍니다.
    일일이 하나하나 코딩하면서 얼마나 오류가 많았을까..
    고생하시는 모습 보고 저도 힘을 얻고 가는건 당연한데요,
    또 막막함이 앞을 가리네요 ㅎㅎ//

    8년 10월10일날 만드셨긴하지만,,
    소스에 대한 간략한 설명..
    부탁드려도 될까요?!

    인천 가천의과학대학교 IT학과에 다니는 3학년 진태완입니다.
    메일은 jintaewan@paran.com 입니다.
    부탁드려도 될까요?!

테이블을 sort 하는 자바스크립트를 만들어봤습니다.

제가 이번에 만든 스크립트는 (언제나 그렇지만) 인라인스타일, 인라인스크립트를 일체 사용하지 않습니다.
특정 class의 태이블을 오름차순 혹은 내림차순으로 정렬합니다.

순번 제목 작가 출판사
1 감독부적격 Moyoco Anno 대원씨아이
2 수수께끼 그녀 X 1 Ushiba Riichi 학산문화사
3 수수께끼 그녀 X 2 Ushiba Riichi 학산문화사
4 수수께끼 그녀 X 3 Ushiba Riichi 학산문화사
5 미나미가 1 Coharu Sakuraba 북박스
6 미나미가 2 Coharu Sakuraba 북박스
7 미나미가 3 Coharu Sakuraba 북박스
8 미나미가 4 Coharu Sakuraba 북박스
9 미나미가 5 Coharu Sakuraba 북박스
10 극락청춘 하키부 1 Ai Morinaga 대원씨아이
11 극락청춘 하키부 2 Ai Morinaga 대원씨아이
12 극락청춘 하키부 3 Ai Morinaga 대원씨아이
13 극락청춘 하키부 4 Ai Morinaga 대원씨아이
14 극락청춘 하키부 5 Ai Morinaga 대원씨아이
15 극락청춘 하키부 6 Ai Morinaga 대원씨아이
16 극락청춘 하키부 7 Ai Morinaga 대원씨아이
17 극락청춘 하키부 8 Ai Morinaga 대원씨아이
18 현시연 1 Kio Shimoku 북박스
19 현시연 2 Kio Shimoku 북박스
20 현시연 3 Kio Shimoku 북박스
21 현시연 4 Kio Shimoku 북박스
22 현시연 5 Kio Shimoku 북박스
23 현시연 6 Kio Shimoku 북박스
24 현시연 7 Kio Shimoku 북박스
25 현시연 8 Kio Shimoku 북박스
26 현시연 9 Kio Shimoku 북박스

Download

table_sort.zip

Code

javascript

  1. function addLoadEvent(func) {
  2.     var oldonLoad = window.onload;
  3.     if (typeof window.onload != 'function') {
  4.             window.onload = func;
  5.     }else {
  6.         window.onload = function(){
  7.             oldonLoad();
  8.             func();
  9.         }
  10.     }
  11. }
  12. function getElementsByClassName(clsName,parentNode) {
  13.  var arr = new Array();
  14.  if (parentNode == null) {
  15.   var elems = document.getElementsByTagName("*");
  16.  } else {
  17.   var elems = parentNode.getElementsByTagName("*");
  18.  }
  19.  for ( var cls, i = 0; ( elem = elems[i] ); i++ ) {
  20.   if ( elem.className == clsName ) {
  21.    arr[arr.length] = elem;
  22.   }
  23.  }
  24.  return arr;
  25. }
  26. addLoadEvent(sortTable);
  27. function sortTable(){
  28.     var body_el = document.getElementsByTagName("body")[0];   
  29.     if (!getElementsByClassName("datatable",body_el))return false;
  30.     var table_el = getElementsByClassName("datatable",body_el);
  31.     for (i=0;i<table_el.length;i++){
  32.         table_el[i]._tr = table_el[i].getElementsByTagName("tr");
  33.         if (table_el[i]._tr[0].parentNode.nodeName!="THEAD")return false;
  34.         for (j=0;j<table_el[i]._tr[0].childNodes.length;j++){
  35.             if(table_el[i]._tr[0].childNodes[j].childNodes[0]){
  36.                var a_el = document.createElement("a");
  37.             a_el.href="#";
  38.             table_el[i]._tr[0].childNodes[j].appendChild(a_el);
  39.             a_el.appendChild(table_el[i]._tr[0].childNodes[j].childNodes[0]);  
  40.                 table_el[i]._tr[0].childNodes[j].className = "button";
  41.                 table_el[i]._tr[0].childNodes[j]._number = j;       
  42.                 table_el[i]._tr[0].childNodes[j]._switch = false;
  43.                 table_el[i]._tr[0].childNodes[j].onclick = function () {
  44.                     for (i=0;i<this.parentNode.childNodes.length;i++){
  45.                         this.parentNode.childNodes[i].className = "button";
  46.                     }   
  47.                     if (this._switch == false){
  48.                         this._switch = true;
  49.                         sortTableABC(this._number,this.parentNode.parentNode.parentNode);
  50.                         this.className = "button up";
  51.                         return false;
  52.                     } else {
  53.                         this._switch= false;
  54.                         sortTableCBA(this._number,this.parentNode.parentNode.parentNode);
  55.                         this.className = "button down";
  56.                         return false;
  57.                     }   
  58.                 }
  59.             }
  60.         }  
  61.     }
  62. }
  63. function sortTableABC(number,table_el){
  64.  var tr_el = table_el.getElementsByTagName("tr");
  65.  var txt = new Array();
  66.  var txt_int = new Array();
  67.  var sum = 0;
  68.  for (i=1;i<tr_el.length;i++){
  69.      txt[i] = tr_el[i].childNodes[number].childNodes[0].nodeValue;
         txt_int[i] = parseInt(txt[i]);
  70.  }
  71.  for (i=1;i<txt_int.length;i++){
  72.       sum = sum + txt_int[i];
  73.  }
  74.  txt = txt.sort();
  75.  if (sum>0) {
  76.      for (i=1;i<txt_int.length;i++){
  77.          for (j=1;j<txt_int.length;j++){
  78.              if (txt_int[i]<txt_int[j]) {
  79.                  var temp = txt_int[i];
  80.                  txt_int[i] = txt_int[j];
  81.                  txt_int[j] = temp;
  82.              }
  83.          }
  84.      }
  85.      txt = txt_int;
  86.  }
  87.      for (i=1;i<txt.length;i++){
  88.          for (j=1;j<tr_el.length;j++) {
  89.              if (txt[i]==tr_el[j].childNodes[number].childNodes[0].nodeValue){
  90.                  tr_el[i].parentNode.appendChild(tr_el[j]);   
  91.              }
  92.          }   
  93.     }
  94. }
  95. function sortTableCBA(number,table_el){
  96.  var tr_el = table_el.getElementsByTagName("tr");
  97.  var txt = new Array();
  98.  var txt_int = new Array();
  99.  var sum = 0;
  100.  for (i=1;i<tr_el.length;i++){
  101.      txt[i] = tr_el[i].childNodes[number].childNodes[0].nodeValue;
  102.      txt_int[i] = parseInt(txt[i]);
    }
  103.  for (i=1;i<txt_int.length;i++){
  104.       sum = sum + txt_int[i];
  105.  }
  106.  txt = txt.sort();
  107.  if (sum>0) {
  108.      for (i=1;i<txt_int.length;i++){
  109.          for (j=1;j<txt_int.length;j++){
  110.              if (txt_int[i]<txt_int[j]) {
  111.                  var temp = txt_int[i];
  112.                  txt_int[i] = txt_int[j];
  113.                  txt_int[j] = temp;
  114.              }
  115.          }
  116.      }
  117.      txt = txt_int;
  118.  }
  119.      var txtCBA = new Array();
  120.      for (i=1;i<txt.length;i++){
  121.          txtCBA[i] = txt[txt.length-i-1];
  122.      }
  123.      for (i=1;i<txtCBA.length;i++){
  124.          for (j=1;j<tr_el.length;j++) {
  125.              if (txtCBA[i]==tr_el[j].childNodes[number].childNodes[0].nodeValue){
  126.                  tr_el[i].parentNode.appendChild(tr_el[j]);   
  127.              }
  128.          }   
  129.      }
  130. }

stylesheet

  1. #content_main table.datatable {
  2.     border:3px solid #f00;
  3.     border-collapse:collapse;
  4. }
  5. #content_main table.datatable td, #content_main table.datatable th {
  6.     border:1px solid #000;
  7.     padding:5px;
  8. }
  9. #content_main table.datatable th{
  10.     background:#ffa;
  11. }
  12. #content_main table.datatable th a{
  13.     color:#600;
  14. }
  15. #content_main table.datatable tr td:nth-child(even){
  16.     background:#fee;
  17. }
  18. #content_main table.datatable tr:nth-child(even) td{
  19.     background:#eee;
  20. }
  21. #content_main table.datatable tr:nth-child(even) td:nth-child(even){
  22.     background:#ecc;
  23. }
  24. #content_main table.datatable tr:nth-child(even) th{
  25.     background:#dd9
  26. }
  27. #content_main table.datatable tbody tr:hover th{
  28.     background:#550;
  29.     color:#fff;
  30. }
  31. #content_main table.datatable tbody tr:hover td, #content_main table.datatable tbody tr:hover td:nth-child(even){
  32.     background:#990;
  33.     color:#fff;
  34. }
  35. #content_main table.datatable thead th {
  36.     background:#faa;
  37. }
  38. #content_main table.datatable th.button {
  39.     cursor:pointer;
  40. }
  41. #content_main table.datatable th.button:hover {
  42.  
  43.     background:#fcc;
  44. }
  45. #content_main table.datatable th.up{
  46.     background:url(images/icon09_up_arrow.gif) right center no-repeat;
  47.     padding-right:13px;
  48.     background-color:#cfc;
  49. }
  50. #content_main table.datatable th.up:hover{
  51.    background:url(images/icon09_up_arrow.gif) right center no-repeat;
  52.    background-color:#efe;
  53. }
  54. #content_main table.datatable th.down{
  55.     background:url(images/icon10_down_arrow.gif) right center no-repeat;
  56.     background-color:#ccf;
  57.     padding-right:13px;
  58. }
  59. #content_main table.datatable th.down:hover{
  60.     background:url(images/icon10_down_arrow.gif) right center no-repeat;
  61.     background-color:#eef;
  62. }

이 글은 스프링노트에서 작성되었습니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/807 관련글 쓰기

  1. Subject: 콩바구니의 알림

    Tracked from kongbaguni's me2DAY 2008/10/07 02:06  삭제

    테이블을 항목별로 오름차순 혹은 내림차순으로 정렬하는 자바스크립트를 만들어봤습니다.

댓글을 달아 주세요

이 글은 콩바구니님의 2008년 6월 21일에서 2008년 6월 28일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/730 관련글 쓰기

댓글을 달아 주세요

삼양라면 구매운동

......
'삼양라면 구매운동’이 누리꾼들 사이에서 확산되고 있다. ‘불매운동’이 아니고 ‘구매운동’이다.
......
이물질까지 나와 물의를 일으켰던 삼양식품 라면에 누리꾼들이 되레 ‘열광’하는 이유는 ‘안티 조중동 운동’과 맥이 닿아 있다. 누리꾼들은 “<조선일보>가 삼양라면만 비판하고 있다”며 ‘안티 조중동 운동’과 연관해 구매운동을 펼치고 있는 것
......

최근 삼양라면 구매운동이 있지요.
저도 이 구매운동에 동참하고자 뭔가 할수있는일이 없을까 궁리하다가. 애니메이션 GIF를 이용한 삼양라면 놀이를 보고 아이디어가 떠올랐습니다. 그것은 삼양라면 그림을 가지고 자바스크립트로 간단한 게임을 만드는것입니다.

게임설명

이것으로 두번째 버전인데요. 첫번째것보다 그림이 커졌습니다. ㅎㅎ
놀이방법은 간단합니다.
번갈아가면서 뽑기 버튼을 누릅니다.
가격이 비싼 라면을 뽑는사람이 승리합니다.
가격이 같으면 중량이 무거운쪽이 승리합니다.
중량도 같으면 하면이름이 더 긴쪽이 승리합니다.
만약 이름의 길이도 같으면 제품 설명이 더 많은쪽이 승리합니다.
만약 서로 같은 라면을 뽑으면, 나중에 뽑은사람이 라면을 다시 뽑습니다.

삼양라면 뽑기놀이

시원하고 얼큰한 대관령 황태라면

황태라면
  • 중량 : 115g
  • 제품특징 : 황태 특유의 시원함과 얼큰한 국물 맛이잘 조화된 제품 양파엑기스 및 참깨분말을 면에 조미해 쫄깃하면서 고소한 면발이 특징. 황태와 콩나물, 무, 야채 등을 푸짐하게 넣어 깔끔 하면서 담백한 맛이 일품

국물없는 볶은 짬뽕간짬뽕

간짬뽕
  • 중량 : 140g
  • 제품특징 : 국물없는 매콤한 해물맛의 볶음짬뽕 제품, MSG무첨가 제품으로 신선한 해물맛이풍부 하면서 매콤한 맛이 일품, 기존 비빔면류와 차별화된 프리미엄 라면

라면보다 더 맛있는 라면맛있는 라면

맛있는 라면
  • 중량 : 115g
  • 비고 : 겨우살이 추출물과 베타글루칸 등 기능성원료 첨가
  • 제품특징 : 60여가지 풍부하고 신선한 재료의 '맛있는' 맛만을 모아놓은 프리미엄 라면
    MSG무첨가 제품으로 각종 건강지향성 재료에서 우러나오는 얼큰하면서도 매운 국물 맛이 일품

진한 육수맛삼양라면

삼양라면
  • 중량 : 120g
  • 비고 : 국내 최초(63.9.15) 라면으로서 미래의 라면모습을 제시함
  • 제품특징 : 진한 육수맛이 함께 어우러져 부드러운맛의 극치를 이룸

고추 양념스프를 별첨한수타면

수타면
  • 중량 : 120g
  • 비고 : 고추 양념스프를 별첨하여 음미할수록 얼큰한 국물 맛을 즐기실 수 있음
  • 제품특징 : 손으로 반죽한 것처럼 면발이 쫄깃하고 고춧가루를 별첨으로 넣어 각자의 기호에 맞추어 먹을 수 있는 제품

70가지 원료와 23가지 영양성분이 골고루 들어있는장수면

장수면
  • 중량 : 115g
  • 제품특징 : 곡류식이섬유 및 참깨분말, 겨우살이 추출물, 브로콜리,포고버섯,루이보스티 등 70가지의 정선된 원료를 첨가하여 칼슘,철,인 등의 23가지 영양분이 듬뿍 함유된 기능성 라면

구수한 된장맛이 그리울 때된장라면

된장라면
  • 중량 : 120g
  • 제품특징 : 부드러우면서도 쫄깃한 면발에 몸에 좋은 전통 발효식품인 된장과 청국장을 첨가하여 구수하면서도 담백한 맛을내는 제품

깔끔하고 시원한 국물맛이 일품인바지락칼국수

바지락칼국수
  • 중량 : 130g
  • 비고 : 기름에 튀기지 않은 논후라잉(Non-Frying) 제품
  • 제품특징 : 기름에 튀기지 않은 논후라잉 면(non-frying)으로, 진공포장하여 별도로 첨부한 바지락과 홍합, 멸치를 푹 우려 만든 국물맛이 조화를 이뤄 깔끔하고 시원한 바지락칼국수의 맛을 느낄 수 있는 제품

정통 중화짜장 요리의 맛을 살린짜짜로니

짜짜로니
  • 중량 : 140g
  • 비고 : 새로워진 조리방법으로 인해 한층 더 깊은 짜장의 참맛을 느낄 수 있음
  • 제품특징 : 고급 소맥분을 사용하여 면발이 쫄깃쫄깃한 중화풍의 고급면. 정통 중화짜장 요리의 맛을 살린 액상 볶음짜장 소스가 첨가되어 본격 고급짜장으로 창조된 제품

열무김치의 시원한 맛열무비빔면

열무비빔면
  • 중량 : 130g
  • 비고 : 후레이크에 건열무김치를 50%이상 함유
  • 제품특징 : 새로워진 열무비빔면.
    더욱 매콤하고 새콤해졌습니다.
    MSG를 첨가하지 않았습니다.
    무더운 여름, 잃어버린 입맛을 살릴 수 있는 제품으로 매콤하고 쫄깃한 맛이 일품. 후레이크 중 건열무김치를 50%이상 함유해서 열무비빔면 고유의 맛을 느낄 수 있는 제품

개운하고 얼큰한대관령 김치라면

대관령 김치라면
  • 중량 : 120g
  • 비고 : 명실상부한 김치라면의 톱브랜드
  • 제품특징 : 생김치를 진공포장하여 첨가하여 개운하고 얼큰한 맛을 내는 제품

쇠고기 육수의 진한맛쇠고기면

쇠고기면
  • 중량 : 120g
  • 비고 : 북한동포 돕기운동의 일환으로 북한에 제공된 제품(97.6.24)
  • 제품특징 : 기존의 쇠고기맛면에 스프의 쇠고기분말 함량을 5배 늘리고 우유를 첨가하여 부드러운 맛과 육수의 진한 맛을 증가시킨 제품

새콤하고 달콤한 맛스파게티

스파게티
  • 중량 : 150g
  • 제품특징 : 새콤하고 달콤한 맛의 스파게티 소스에 쫄깃한 면발과 마카로니, 풍부한 야채를 더해 담백하고 깔끔한 맛이 일품인 제품

시원한 멸치국물잔치국수

잔치국수
  • 중량 : 90g
  • 제품특징 : 기름에 튀기지 않은 저칼로리(290Kcal) 제품.
    다시마,가쓰오부시 등을 이용한 담백하면서도 구수한 육수맛이 특징.
    면 위에 뿌려먹는 야채후레이크(고명)가 들어있어 진정한 잔치국수의 맛을 느낄 수 있는 제품. 無MSG

얼큰하고 시원한해물짬뽕

해물짬뽕
  • 중량 : 120g
  • 비고 : 고정적인 소비자를 확보한 제품
  • 제품특징 : 얼큰하고 시원한 해물맛 짬뽕 라면 MSG무첨가 제품으로 기존 제품보다 더욱 얼큰하고 시원한 맛을 보강한 해물맛이 듬뿍담긴 라면

김치의 맛을 최대한 살린新김치라면

新김치라면
  • 중량 : 120g
  • 비고 :
  • 제품특징 : 푸짐한 김치후레이크로 김치의 맛을 최대한 살린 제품으로 진한 국물맛을 느낄 수 있도록 했다.

면발이 쫄깃하고 얼큰한 맛이 일품인육개장

육개장
  • 중량 : 120g
  • 비고 : 이백냥에서 개선된 제품
  • 제품특징 : 풍성한 양념과 얼큰한 맛이 잘 조화됨

기름에 튀기지 않아 깔끔한손칼국수

손칼국수
  • 중량 : 100g
  • 비고 : 기름에 튀기지 않은 논후라잉(Non-Frying) 제품
  • 제품특징 : 손칼국수는 기름에 튀기지 않은 논후라잉(Non-Frying)공법을 통해 제조되었으며, 소맥분을 사용하여 면발이 쫄깃하고 분말스프와 후레이크가 잘 조화를 이뤄 전통 손칼국수 맛을 냄

쫄깃한 면발과 얼큰한 국물맛쌀라면

쌀라면
  • 중량 : 120g
  • 제품특징 : 쫄깃한 면발과 얼큰한 국물맛을 내는 고급스러운 봉지면으로 시장에서 유일한 제품(쌀 15% 첨가)

진한 사골 곰국맛이 일품인설렁탕면

설렁탕면
  • 중량 : 110g
  • 제품특징 : 사골을 푹 고아 농축시켜 만들어서 진한 맛이 그대로 살아있으며 구수한 국물맛을 느낄수 있는 고급제품

면발이 더울 쫄깃쫄깃하고 부드러운감자라면

감자라면
  • 중량 : 117g
  • 제품특징 : 감자라면은 감자가루와 감자전분으로 면을 만들어 감자특유의 맛과 향이 살아있는 제품으로 면발이 더욱 쫄깃쫄깃하고 부드러우며 버섯, 마늘, 건파 등 푸짐한 야채건더기로 국물맛을 내어 얼큰하며 개운한 맛이 특징

튀기지 않은 깔끔한 맛기름에 안튀긴면

기름에 안튀긴면
  • 중량 : 100g
  • 제품특징 :기름에 튀기지 않아 느끼하지 않고 부드러운 맛이 특징. 된장,청국장을 사용한 구수하면서도 담백한 국물맛과 쫄깃한 면발이 조화를 이룬 제품.

사리전용사리면

사리면
  • 중량 : 110g
  • 비고 : 틈새시장 공략과 환경보호에 앞장선 특화된 제품
  • 제품특징 : 스프가 없는 사리전용 면
Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/726 관련글 쓰기

  1. Subject: 콩바구니의 알림

    Tracked from kongbaguni's me2DAY 2008/06/25 01:19  삭제

    자바스크립트로 구현한 삼양라면 뽑기놀이 ver0.2약간 버전업 했습니다. 그림이 커졌고, 웹표준 기반 코딩으로 시각장애인을 위한 장치도 마련되었습니다. 퍼가기가 쉽도록 본문안에 스타일시트와 자바스크립트를 집어넣은것이 유효성검사에 걸리긴하지만 뭐 이정도는 괜찮으려나요.

  2. Subject: 뜨는 삼양라면과 지는 농심라면

    Tracked from 순디자인기술지원센터 2008/06/26 23:16  삭제

    요즈음 삼양라면 먹어주기 운동이 한창이라지? 농심라면은 불매운동으로 죽쑤고 있고. 후후후~ 아내에게 '맛있는 라면'을 끓여주고 키보드 앞에 앉았다. 내가 지금부터 쓸 이야기는 아련한 기억속으로 사라질 줄 알았었는데 요즈음 삼양라면 관련 새소식으로 결국 이렇게 쓰게 되는구나. -- 지금의 아내와 난 을지로에서 처음 만났다. 같은 기획실에서 근무하다가 연인으로 발전했다. 어떤 이유에서인지 기획실을 몇차례 옮기게 되었는데 우연인지 필연인지 아내는 삼양사보..

댓글을 달아 주세요

  1. BlogIcon 이정일 2008/06/26 23:16  댓글주소  수정/삭제  댓글쓰기

    재밌네요.

자바스크립트로 작동하는 삼양라면 뽑기 놀이 입니다.
뽑기 버튼을 눌러서, 비싼라면을 뽑는사람이 이기는것입니다.
만약 가격이 똑같으면 중량이 더 무거운사람이 승리입니다.
중량도 같으면, 라면이름이 한자라도 더 긴사람이 승리입니다.

사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지
사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지사용자 삽입 이미지

뽑기버튼 누르고 라면내기 시합을 해봅시다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/725 관련글 쓰기

댓글을 달아 주세요

이 글은 kongbaguni님의 2008년 2월 6일에서 2008년 2월 15일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/681 관련글 쓰기

댓글을 달아 주세요

자바스크립트로 간단한 슈팅게임을 만들수 있지 않을까? 하는 생각이 문득 들었습니다.
가능하더군요. ㅎㅎ

첨부파일을 다운받아 압축을 푸신후 index.html파일을 웹브라우저에서 여시면 됩니다.
이 스크립트는 파이어폭스, 사파리, 오페라에서 잘 작동하지만. 익스플로러에서는 작동하지 않습니다.

ver 0.01 : 2008년 1월 27일


주요 업데이트 내용

  1. 주인공의 4방향 움직임 구현
  2. 주인공이 칸 밖으로 나갈수 없도록 함
  3. 방향에 따라 주인공의 그림이 바뀌도록 함
Play 하기

ver 0.02 : 2008년 1월 28일

주요 업데이트 내용

사용자 삽입 이미지
  1. 부드럽게 움직이는 주인공.
  2. 주인공 크기를 64*32 에서 64*64의 애니메이션 GIF로 변경. 방향에따라 그림이 바뀌는 효과는 보류.
  3. 주인공의 움직임에 따라 배경도 따라 움직이는 기능 추가.
  4. 배경그림 변경
Play 하기

ver 0.03 : 2008년 1월 29일

주요 업데이트 내용

  1. 주인공의 움직임에. 약간의 버그 수정.
  2. 배경이 좌우 상하 4방향으로 움직임.
  3. 주인공이 움직이는동안 입력불가모드 적용. 멈추고나서 입력가능해짐.
Play 하기

ver 0.04 : 2008년 1월 30일

주요 업데이트 내용

사용자 삽입 이미지
  1. 주인공 그림을 24비트PNG포멧으로 변경.
  2. 배경이 입체적으로 움직임.(3중레이어)
  3. 배경음악. 효과음 버튼적용.
Play 하기

ver 0.05 : 2008년 1월 30일

주요 업데이트 내용

  1. 배경그림을 3중에서 5중으로 업그레이드.
Play 하기

ver 0.06 : 2008년 1월 31일

주요 업데이트 내용

  1. 배경음악 . 효과음버튼 제거 (딜레이 문제해결때까지 보류)
  2. 알고리즘 제편성. 환경변수 정리작업.
  3. 8방향 움직임의 구현.
Play 하기

ver 0.07 : 2008년 2월 3일

주요 업데이트 내용

사용자 삽입 이미지
  1. 알고리즘 제편성. 환경변수 정리작업.
  2. 쏟아지는 적군 구현.
  3. 간단한 상태창 구현.
  4. 진행방향마다 다른 동작의 애니메이션 구현.
Play 하기

ver 0.1 : 2008년 2월 4일

주요 업데이트 내용

사용자 삽입 이미지
사용자 삽입 이미지
  1. 미사일 그래픽 업그레이드.
  2. 난이도 설정 구현.
  3. 미사일과 충돌 이벤트 구현.
  4. 게임오버 이벤트 구현.
  5. 잠깐멈춤 기능 구현.
Play 하기

ver 0.11 : 2008년 2월 8일

주요 업데이트 내용

  1. 움직임에따라 배경그림위 위치가 틀어지는 버그 해결.
  2. 잠깐멈춤시 화면디자인.
  3. 마우스좌표를 인식하여 움직이는 UI도입.
Play 하기
Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/675 관련글 쓰기

댓글을 달아 주세요

  1. BlogIcon 도트 2008/01/28 18:28  댓글주소  수정/삭제  댓글쓰기

    음! 이거 정말 신기한데요!
    올려주신 파일로 한 번 실행에 봤는데 정말 신기하네요.
    갑자기 확 흥미가 생기는 기분이랄까요? 흐흐;
    근데 마우스 클릭이 아닌 키보드로 움직이게 하려면 어떻게 해야 되나요?

  2. BlogIcon 공상플러스 2008/01/29 13:17  댓글주소  수정/삭제  댓글쓰기

    하하하하하하.. 플래시로 하시는 것을 권장하는데요..

    의외로 쉽거든요..--

    • BlogIcon 콩바구니 2008/01/29 19:50  댓글주소  수정/삭제

      플래시로 슈팅게임 만드는거.
      콜린무크가 쓴 액션스크립트3 관련서적. 한글판이 나오거든 그때 고려해보지요.
      쉽고 어렵고의 문제가 아닙니다.
      웹표준 을 준수하면서. 자바스크립트와 CSS만으로 이런것도 시도할수 있다는것을 보여주기위한 프로젝트 이랄까요. 공부의 일환이기도 하구요.

  3. BlogIcon 2008/01/31 13:36  댓글주소  수정/삭제  댓글쓰기

    우왕ㅋ굳ㅋ

  • 불만제로. 왜 자영업자만 때리고 그럽니까? 만만해서일까요? 중국집 쿠폰주문 탕수육과 현금주문 탕수육에 배달시간. 양. 질 적인 차이가 있는것이 뭐가 그리 문제인지 모르겠습니다. 현대타이어라던지. 뒤가 구린 대기업 많은데 그쪽의 불만은 캐기가 무섭나보지요. (mbc 불만제로 참 싫다) 2008-01-31 19:30:59

  • 자바스크립트로 슈팅게임게임오버 이벤트 추가. 자잘한 버그 수정. HP(helth point), EP(energy point) 게이지 추가. 전지 잔량이 0이되면 생명력이 줄어듭니다. 가운대버튼을 누르면 EP가 충전됩니다. (자바스크립트 슈팅게임 만들기) 2008-02-01 13:13:24

  • 슬슬 게임 제목을 생각하는게 좋을까요?안드로이드 소녀가 악의 무리에 납치당한 주인을 구출하러 간다는 내용으로, 최고점수가 서버에 기록되는 형태의 웹게임 으로 완성을 생각하고 있습니다. 게임 스토리나 제목 등에 좋은의견 있으신분 말씀해주세요 ㅎㅎ (자바스크립트 슈팅게임 만들기) 2008-02-01 16:26:46

  • 가끔. 혹시 나는 천재가 아닐까 하는 생각을 하곤해요. (착각) 2008-02-01 16:29:47

  • 이게임의 특징1:웹표준을 준수합니다. 2:익스플로러에서 작동하지 않습니다.(MS익스플로러가 비표준 브라우저라서 생기는 문제입니다.) 3: 게임을 하기위해서는 파이어폭스를 설치해야 합니다. 4: 익스플로러의 점유율을 낮추는데 일조할수 있습니다. (자바스크립트 슈팅게임 만들기 웹표준 장점) 2008-02-01 16:58:51

  • 자바스크립트 게임만들기 ver 0.10 갱신. 이제 좀 게임 모양세가 나는듯 합니다. (자바스크립트 슈팅게임 만들기) 2008-02-04 05:28:58

  • 이프로그렘을통해 웹브라우저의 자바스크립트 처리능력을 테스트해보는건 어떨까 하는 생각이 들었습니다. 파이어폭스, 오페라, 사파리. 전부 게임진행속도가 차이가 있더군요. (웹표준 준수하는 자바스크립트 슈팅게임 웹브라우저 벤치마크) 2008-02-04 14:44:05

  • 오늘은 블로그에서 흔히 플래시로 구현하곤 하는 움직이는 테그구름을 자바스크립트로 구현해보았습니다. 이번에도 익스플로러 지원은 고려하지 않았습니다. 그거 신경쓰려면 골치아프고. 익스플로러에서 기능의 100% 는 무리지만. 최소한 내용은 볼수있으니 괜찮다고 생각해요.ㅎㅎ (자바스크립트 공부) 2008-02-05 05:10:46

  • 국가공무원임용고시에 전산 과목으로 무작정 시험접수 넣었습니다. 오늘까지네요. 이제부터 공부해야하는데. 뭘 공부해야 좋을까요... (공무원 임용고시 준비) 2008-02-05 21:39:35

  • 오늘부터 블로그 보안계획 가동합니다. 스킨에 덕지덕지 붙었는 비표준자바스크립트와. 군더더기. 불필요한 CSS선언문. 필요없는 마크업 등등. 전부 정리할생각이라죠. 속도 좀 빨라지겠죠? (블로그 보안계획) 2008-02-05 23:14:40

  • 티스토리 블로그에서도 이화면을 볼수 있었으면 좋겠어요.. 몇몇 플러그인이때문에 유효성검사를 통과하지 못한다고 그렇게 리포팅 했는데도.. 아직도 그대로인걸 보면. 이런쪽은 해결할 의지가 없나봅니다. 알고보면 이 테스트 통과하는거 그렇게 어렵지 않은데 말이죠. (xhtml 유효성검사 웹표준) 2008-02-05 23:19:13

이 글은 kongbaguni님의 2008년 1월 30일에서 2008년 2월 5일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/677 관련글 쓰기

댓글을 달아 주세요

이 글은 kongbaguni님의 2008년 1월 22일에서 2008년 1월 29일까지의 미투데이 내용입니다.

Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/676 관련글 쓰기

댓글을 달아 주세요

공모전 준비용 원고를 하려는데 주제를 어떻게 정햐야할지 도저히 감이 안잡혀서.. 컴퓨터의 도움을 얻고자 간단한 프로그램을 짜보았습니다.

사용자 삽입 이미지

이것은 바로 101 가지의 주제어를 입력해놓고 이중에서 임의로 3가지의 주제어를 뽑아주는 제비뽑기 프로그램입니다.

사용자 삽입 이미지

소스의 23번째줄부터 123번째줄까지의 배열문에 변수를 수정하여 주제어를 수정하거나 추가로 등록할수 있습니다.

다운로드

주제어를 뽑아봅시다. F5를 누르면 갱신합니다.

등록된 낱말들


Posted by 콩바구니

트랙백 주소

http://kongbaguni.tistory.com/trackback/545 관련글 쓰기

댓글을 달아 주세요