RedPlusPhotoView.htm |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>사진 상세 보기 프로그인 제작 </title> <link href="jquery.redplus.photoview.css" rel="stylesheet" type="text/css" /> <script src="../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script> <script src="jquery.redplus.photoview.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { // 썸 내일 이미지 개체 리스트에 상세 이미지 출력 $('#products img').photoview({ photoElement: '#photo', // 사진 보여줄 개체 previousControl: '#prev', // 이전 버튼 개체 nextControl: '#next', // 다음 버튼 개체 firstControl: '#first', // 처음 버튼 개체 lastControl: '#last' // 마지막 버튼 개체 }); }); </script> </head> <body> <h1>상품 상세 보기</h1> <div id="products"> <img src="../ProductImages/thumbs/BOOK-01.jpg" /> <img src="../ProductImages/thumbs/COM-01.jpg" /> <img src="../ProductImages/thumbs/HARDWARE-01.jpg" /> <img src="../ProductImages/thumbs/Online-01.jpg" /> <img src="../ProductImages/thumbs/SOFTWARE-01.jpg" /> </div> <div id="big"> <img id="photo" src="" alt="상세 이미지 " /> </div> <div id="navi"> <button type="button" id="first">처음¨ö</button> <button type="button" id="prev">이전</button> <button type="button" id="next">다음</button> <button type="button" id="last">마지막 </button> </div> </body> </html> |
'.Net Project > Jquery 1.3.2' 카테고리의 다른 글
| 83장 JQuerySample 예시 테이블 (Table.htm) (0) | 2009.11.25 |
|---|---|
| 82장 JQuerySample 체크 박스 선택/해제 (CheckBoxAllCheck.htm) (0) | 2009.11.25 |
| 80장 JQueryPlugIn 새로운 함수 생성 (Replace.htm) (0) | 2009.11.25 |
| 79장 JQueryUI 탭 컨트롤 (Tabs.htm) (0) | 2009.11.25 |
| 78장 JQueryUI 아코디언 컨트롤 (Accordion.htm) (0) | 2009.11.25 |