반응형 jQuery26 MES 시스템 - 데이터 수집 분석 통계 웹프로그램 이번에 개발 중인 시스템입니다. 생산공장에서 사용합니다. 생산 제품의 검사 정보를 수집, 통계, 분석하는 웹 프로그램입니다. 개발시작: 2013년 05월 서버 개발언어: PHP, Javascript 서버 개발프레임웍: XE, jQuery(jQGrid, jQPlot) - opensource 서버 데이터베이스: MySQL 클라이언트 개발언어: Visual Basic 6 시스템 구성 1. 클라이언트PC에서 바코드 스캔 및 제품 검사 2. 서버 Database로 데이터 전송 3. 서버에서 데이터 조회 공정별 검사 시스템의 측정 결과를 Database 서버로 전송 하면 Database 서버에서 측정 결과를 볼 수 있습니다. 그림 설명은 아래 사이트를 참고하세요. http://simulz.kr/xe/board_ph.. 2013. 5. 25. (jQueryMobile) 모바일용 디자인 jQuery의 Mobile을 사용하면 스마트폰용으로 디자인을 할 수 있다. IE9에서는 이미지가 깔끔하게 나오지 않고 효과도 볼 수 없다. 구글 크롬에서 완벽하게 테스트 해볼 수 있다. 아래 페이지는 BOINCSTATS 통계 보기를 모바일용으로 꾸민것이다. http://simulz.kr/dev/boinc/create_user_img_mobile.php Input의 type값을 search로 설정하면 아래처럼 내용 삭제 버튼이 추가 된다. Select에 data-native-menu="false" 속성을 추가하면 아래처럼 바꿀 수 있다. 2011. 7. 30. (jQuery) 7세그먼트, FND 포트 계산기 jQuery를 사용하여 FND 계산기를 만들었다. 미리보기 http://simulz.kr/dev/elec/7seg/ 기능 100% 버튼위에서 마우스 휠을 돌리면 확대·축소, 누르면 원래대로 FND 색상 설정 FND 추가·삭제 UI 테마 변경 추가할 기능 포트 순서 변경 결과 값 저장 등등등 2010. 3. 29. (jQuery) 이미지 카운터 실시간 갱신하기 준비물: (jQuery) 연결하기 블로그 이미지 그래프 카운터를 자동 새로고침 해보기. 아래 자바스크립트코드를 SCRIPT에 삽입하거나 JS 파일로 저장하여 연결한다. $(document).ready(function($){ var refresh_StatGraph = function() { var time = new Date().getTime(); var StatGraph = $("img[src*=StatGraph]"); //StatGraph.fadeOut('slow'); StatGraph.attr('src','/plugins/StatGraph/count/count.php?owner=개인번호&time='+time); //StatGraph.fadeIn('slow'); } self.setInterval(ref.. 2010. 2. 9. (jQuery) 다음뷰 추천 버튼 바꾸기, 관련글 지우기 준비물: (jQuery) 연결하기 다음뷰 추천 플래시를 작은 것으로 바꾸고 그 아래에 표시되는 관련글을 삭제할 수 있다. 아래 자바스크립트 코드를 SCRIPT 태그로 감싸거나 JS 파일로 저장해서 연결한다. $(document).ready(function($){ var daumview = $('.blogger-news-widget'); $('.blogger-news-widget').html(daumview.html().replace('recombox1.swf', 'recombox3.swf').replace('400','67')); $('.article iframe[src*=daum]').remove(); }); var daumview = $('.blogger-news-widget'); 객체 재사용을 위해.. 2010. 2. 7. (jQuery) JSONP로 크로스 도메인 원격 데이터 가져오기 준비물: (jQuery) 연결하기 브라우저 기본 보안 설정으로는 현재 페이지의 호스트가 아닌 다른 서버에 HTTP 요청을 할 수 없다. 하지만 JSONP를 사용하면 보안 설정을 바꾸지 않고도 원격 데이터를 가져올 수 있다. 이 블로그에서는 게시물 아래 인기순 Top 글 목록에 적용되어있다. 데이터를 보내줄 원격 도메인 쪽에 JSON 형식으로 출력하도록 PHP 스크립트 코드를 작성한다. $json['key'] 에 저장된 자료는 자바스크립트에서 data.key 형식으로 가져올 수 있다. json_encode() 배열을 JSON 형식으로 인코딩한다. 데이터를 보여줄 곳에 스크립트를 작성한다. $.getJSON("http://simulz.com?callback=?", function(data) { $(selec.. 2010. 2. 6. (jQuery Plugin) CyclicFade 깜빡이는 효과 적용하기 준비물: (jQuery) 연결하기 비표준 태그를 jQuery 플러그인으로 부드럽게 깜빡이는 효과를 줄 수 있다. 자바스크립트 연결하기 제작자 원문: http://www.bugzappy.com/cyclic-fade-jquery-plugin/ 적용하기$(selector).cyclicFade(); $(selector).cyclicFade(); selector로 지정한 요소들에 .cyclicFade() 플러그인 메서드를 적용한다. 편리한 방법으로는 HTML을 작성할 때 적용을 원하는 요소에 class='cyclicfade' 처럼 임의의 클래스를 지정해주고 $('.cyclicfade').cyclicFade(); 처럼 사용하면 cyclicfade 클래스를 가진 모든 요소에 적용이 된다. 다양한 옵션을 줄 수 있다... 2010. 2. 6. (jQuery) 블로그 태그 목록을 버튼으로 섞기 준비물: (jQuery) 연결하기 관련글 (jQuery) 태그 목록 섞기(jQuery) 티스토리 태그 목록 컬러풀하게~ 이번엔 버튼으로 섞어보자. 버튼을 누르면 글자 색상, 크기가 임의로 지정되고 순서가 섞이게 된다. 이전 글(관련글 참고)에서 작성한 코드를 재사용하기 위해 함수 안에 넣는다. var tag_random = function() { var taglogli = $('.taglog li'); taglogli.find('a').each(function() { $(this).css('color', getRandomRGB).css('font-size', getRandomNumber(8,24)+'pt'); }); taglogli.shuffle(); } $("태그 섞기!").click(function(.. 2010. 2. 5. (jQuery) 블로그에 로딩 중 표시하기 준비물: (jQuery) 연결하기 이 블로그에 적용되어 있다.HTML에서 로딩 메시지 코드를 추가한다. 문서 상단에 추가할 수록 빨리 보인다. 바로 밑에 넣어도 된다. 로딩 중... CSS에 추가한다. #loading { border: 1px #000 solid; background-color: #eee; font-size:20pt !important; color:#000; text-align:center; top: 50%; left: 50%; padding-top: 10px; margin: -100px 0 0 -50px; width: 200px; height: 100px; z-index:10; position: absolute; } width, height를 알맞게 바꾼 후, margin의 top, l.. 2010. 2. 5. 이전 1 2 3 다음 반응형
