웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] Lightweight Rating System With Custom Icons - jQuery Rating.js 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall] Lightweight Rating System With Custom Icons - jQuery Rating.js

해피CGI윤실장 2020. 10. 5. 09:26
각종 평가 점수를
별모양의 아이콘을 선택해서 입력받을수 있는
jQuery 플러그인 입니다.

다운로드 받은 파일의 압축을 해제한후
index.html 파일을 크롬 웹브라우저로 열어 보면
별점선택을 하는 화면의 확인이 가능합니다.

 


별모양의 아이콘을 화면에 표시해주고,
클릭을 하면 점수를 화면에 표시를 해주네요.


별모양 아이콘 뿐만 아니라,
아이콘을 커스텀해서 다른 아이콘을 이용하는 것도 가능합니다.

 



사용하는 방법도 복잡해보이지는 않네요

 



위 4가지가 기본이며,

 




클릭 이벤트를 걸거나,
별의 개수를 10개로 늘려서 0~10점 사이의 점수를 받는다거나,
별 반개만 선택해서 .5 점을 이용하거나,
별 아이콘의 색상을 조절을 하거나,
별 아이콘 대신 다른 아이콘으로 커스텀하는 예제는 위 소스코드와 같습니다.

그 외에도,

 



페이지 로딩시 별 모양 아이콘이 선택되어져 있는 점수를 지정하는 예제라던가,
점수를 변경하지 못하도록 readonly 시키는 예제라던가,
기본적인 옵션들을 JS가 아닌, HTML 태그에 포함시키는 예제도 있습니다.

 

 

홈페이지바로가기

Comments