한창 작업 중인 쇼핑몰 사이트에 사용하기 위해 jQuery Validation 플러그인을 찾아보니 다행히 마음에 드는 강력한 플러그인이 있어 소개하고자 한다. 매번 직접 스크립트로 폼의 데이터를 검증했는데 이제는 좀 편하게할 수 있겠다. Validation 플러그인 공식사이트 : http://bassistance.de/jquery-plugins/jquery-plugin-validation/ Validation 플러그인 참고 문서 : http://rocketsquared.com/wiki/Plugins/Validation 아래는 어떤 식으로 사용이 되는지를 보여주는 간단한 예제이다. 참고 예제 : http://jquery.bassistance.de/validate/demo/milk/ <script id=”demo” …
작업 중인 사이트에서 컬러 이미지를 그레이스케일로 변환하고 마우스 오버시 테두리와 원래 이미지가 보여야 하는 기능이 필요해서 구글링을 해본 결과 쉽게 적용할 수 있는 자바스크립트 소스가 있어 급하게 테스트용으로 코드를 작성해 봤다. 아래 이미지와 같은 기능을 구현하는 것이다. cfile8.uf.194F183C4EB7942E255FBE.js 이미지를 그레이스케일로 변환하는 자바스크립트 소스는 위 grayscale.js 파일을 다운로드 하여 사용하면 된다. 테스트에 사용한 소스코드는 아래와 같다. …
사이트 작업 중에 즐겨찾기/북마크 추가 기능이 필요해서 jQuery 플러그인을 검색해보니 jFav라는 플러그인이 있었다. 간단하게 즐겨찾기/북마크 추가 기능을 구현할 수 있는 플러그인으로 잘 활용하면 유용할 것 같다. ㅎㅎ jFav 다운로드 : http://plugins.jquery.com/project/jFav 사용법은 아래와 같다. <script type=”text/javascript” src=”./js/jFav-1.0.js”></script> 즐겨찾기/북마크 링크는 아래와 같이 지정해준다. <a id=”AddBookmarkButton” href=”http://www.aaa.com/” title=”사이트AAA”><img src=”./bookmark_btn.png” alt=”즐겨찾기 추가” /></a> <script type=”text/javascript”> $(function() { …
다음에 보면 아래와 같은 컨텐츠가 있다. 이 부분은 마우스 스크롤링 때 마지막 데이터가 되면 다음 데이트를 자동으로 불러오는데.. 오늘은 이걸 한번 만들어 보기로 했다. 어디에 쓸지 아직 정하지는 않았지만 말이다. ㅋ 이것을 구현하기 위해 jQuery를 이용했고 데이터는 PHP를 이용해 DB에서 불러오도록 작성을 했다. scroll.php <?php include_once(“./_common.php”); include_once(“$g4[path]/head.sub.php”); ?> <link rel=”stylesheet” href=”<?=$g4[‘path’]?>/scroll_style.css” type=”text/css”> <div id=”wrap”> …
어제 jQuery Plugin Easy Widgets 포스트에서 구상했던 페이지를 간단하게 구현해봤다. 작업은 생각한 것보다 어렵지 않았고 jQuery를 이용했기 때문에 쉽게 구현이 될 수 있었던 것 같다. 이 기능은 쇼핑몰에서 상품 리스트 정렬 순서를 변경할 때 사용하려고 한다. 상품 리스트에서 상품 순서를 변경 후 완료 버튼을 누르면 모든 상품에 대해서 정렬 순서를 변경하는 것이 핵심이다. 단 상품이 …