일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- #솔루션
- javascript
- 쇼핑몰
- #해피CGI
- #happycgi
- 게시판
- #동영상
- 해피씨지아이
- 웹솔루션
- CGIMALL
- CSS
- 해피CGI
- #cgimall
- 사이트제작
- #이미지
- #CSS
- 홈페이지제작
- #jQuery
- #업종별
- jquery
- happycgi
- #쇼핑몰
- #image
- #뉴스
- #홈페이지
- php
- #웹솔루션
- #홈페이지제작
- 홈페이지
- 솔루션
- Today
- Total
목록웹프로그램밍 자료실/JAVA 자료 (805)
웹솔루션개발 25년 노하우! 해피CGI의 모든것
* jquery Quttons - Qunatum Paper 는 새로운 내용을 수용하기 위해 크기, 모양 및 색상을 변경할 수 있는 디지털 용지 입니다 - 버튼에 대한 시각적인 효과와 함게 메모내용을 버튼에 삽입할 수 있는 기능을 제공합니다 * 사용방법 - 첨부된 압축파일을 해제하여 웹사이트에 적용할 디렉터리에 압축을 해제하여 기본제공되는 js,css 파일을 html 문서에 삽입합니다 그이후 대화상자를 디자인하며 원하는 css 스타일을 사용하여 div 를 디자인 합니다 웹에서 URL 호출하여 실행할 경우 아래와 같은 결과를 확인할 수 있습니다
셀렉트박스 태그를 이용해서 간단하게 태그 셀렉터를 만들수 있는 예제입니다. 첨부된 파일을 다운로드 받아서 압축을 풀어보면 tagselect.html 이라는 파일을 웹브라우저로 열어서 보면 확인이 가능합니다. 위 와 같은 태그 선택상자를 제작하려는 분들께 유용할 것 같네요. HTML파일의 소스코드를 보면 위와 같은 기본 select 태그와 option태그를 만들어주고, 비교적 간단한 Jquery 스크립트를 실행하는 걸로 첫번째 그림과 같이 태그를 선택할수 있는 부분과, 이미 선택된 태그를 표시해주고, 선택된 태그를 x 표시를 눌러서 삭제하는 것 까지 가능해지네요. 셀렉트박스가 있는 페이지에서 크게 손을 안대고도 위 그림과 같은 태그셀렉트를 화면에 표시할수 있다는 것이 장점일 듯 합니다. 출처는 https:..
jQuery 를 이용하여 데이터를 차트화 할 수 있습니다. 차트 종류가 다양하게 제공되는데요. 꼭 서버의 모니터링 툴을 만들때 cpu 사용량이나 메모리 사용량 등에 쓰면 좋을듯 하네요 ^^; 아래의 코드로 쉽게 시작 할 수 있습니다. ^^ // Create a Zeu TextMeter. var textMeter = new zeu.TextMeter('text-meter'); // Update display and percentage value. textMeter.displayValue = 'ZEU'; textMeter.value = 90; *License : MIT
CKEditor Youtube Plugin 입니다. CKEditor 에는 youtube Plugin 이 있었습니다. 예전의 Youtube Plugin 보다 기능이 더 강화 되었네요. ^^ *Youtube Plugin 에 추가 기능 안내 1.반응형 선택 기능 2.비디오 이미지와 링크만 달기 기능 3.플레이어 컨트롤 표시 기능 * 라이센스(무료) - GPLV3, LGPL3, MPL * 설치방법 - 플러그인 파일을 다운로드 받아 ckeditor 가 설치된 폴더내 plugins 폴더안에 업로드 합니다. 예)http://example.com/ckeditor/plugins/youtube - ckeditor 의 설정파일인 config.js 파일을 열어 아래 소스를 추가합니다. config.extraPlugins = ..
위와 같이 셀렉트 박스에 이미지 아이콘 등을 넣을수 있습니다. 소스는 첨부 파일의 소스를 참고하시면 됩니다.
Richtext Editor 기반의 텍스트위주의 에디터 입니다. 첨부파일을 다운로드 받아서 압축을 해제하여 demo.html 파일을 웹브라우저로 열어보면 에디터 프로그램의 데모확인이 됩니다. 텍스트 위주의 입력이 가능하며, 이미지링크, 하이퍼링크, 텍스트정렬, 텍스트 하이라이트 정도의 심플한 기능만 가지고 있으며, 에디터를 구성하는 프로그램 자체가 위 그림 처럼 파일이 3개 뿐이어서 상당히 쉽게 웹페이지에 붙여넣을수 있게 되어 있네요. 출처는 https://www.sourcecodester.com/javascript/12538/simple-richtext-editor-based-pelljs.html 입니다.
inputmask는 INPUT 박스에 정보 입력시 지정된 형식으로만 입력이 가능하도록 도와줍니다. - 라이센스 MIT - 사용 방법 1. 사용할 페이지 상단에 jQuery 라이브버리와 inputmask 라이브러리 링크를 걸어줍니다. 2. input 박스를 추가하고 data-inputmask 속성을 사용하여 형식을 입력해 줍니다. 3. inputmask 플러그인을 호출합니다. 4. 세부 옵션은 아래 페이지를 통해 확인 가능합니다. https://www.jqueryscript.net/form/Easy-jQuery-Input-Mask-Plugin-inputmask.html - 결과물
- 라이센스 MIT - 사용 방법 1. 작업할 페이지 상단에 jquery 라이브러리, 부트스트랩 링크를 추가합니다. 2. jquery 라이브러리 하단에 Bootstrap Multiselect 라이브러리 링크를 추가합니다. 3. SELECT 박스를 추가합니다. 4. 플러그인을 호출합니다. 5. 세부 옵션이나 기본 설정을 변경합니다. - 결과물
http://countdownjs.org/demo.html 데모페이지에서 확인하는 방법을 먼저 안내드립니다. 위 countdown date 값에 구하고 싶은 날짜를 입력하면, 설정된 일정에 맞게 카운트 정보가 출력됩니다. 구하고자 하는 카운트는 "millennaia(천년단위)" 부터 "milliseconds (밀리세컨)" 단위까지 카운트 정보를 담을 수 있습니다. 구하고자 하는 object 단위를 실시간으로 확인할 수 있어 어떤 값이 담겨 출력중인지도 확인할 수 있습니다.