728x90 반응형 CSS10 [jQuery] 간단한 별점 기능 리뷰 폼 작성 물건을 사고 나서 리뷰를 작성하거나,온라인으로 어떤 일이든 돈을 주고 나면 후기를 작성하는 경우가 많습니다. 이런 경우 후기에는 별점이 빠질 수 없습니다.이런 별점 시스템을 통해서 사용자들은 좀 더 쉽고 편하게 이 서비스의 품질을 알 수 있고,내가 사용한 상품에 대해서도 상세한 후기를 적어 판매자와 이후 구매할 소비자들에게 좋은 영향을 끼칠 수 있습니다. 그럼 간단하게 이런 별점 시스템, 리뷰 폼을 작성하는 법을 알아보겠습니다. html 코드 작성 먼저 html 코드를 작성해 보겠습니다. 리뷰작성 폼 html 코드는 정말 간단하게 적어보았습니다. star_rating 클래스에는 별점을 표시해 줄 별의 이미지와 빈별의 이미지를 나타내줄 span태그를 사용했습니다.이.. 2023. 9. 25. [jQuery] 애니메이션이나 효과를 중지 시키는 stop() 개요 이전 포스팅에서 아래로 슬라이드와 위로 슬라이드, 트리거 사용을 해보았는데요.이번에는 슬라이드 같은 애니메이션을 사용할 때 애니메이션을 나는 그만보고 싶다. 혹은 웹게임을 만들 때, 움직이는 몬스터들에게 꼼짝 못 하게 하는 기능 등 이런저런 상황에서 사용될 수 있는 제이쿼리의 stop() 메서드에 대해서 알아보도록 하겠습니다. 동작 화면 동작하는 이미지는 위와 같습니다.아래로 슬라이드를 눌러서 슬라이드 애니메이션이 작동중일 때,슬라이드 멈추기 버튼을 누르면 작동하는 중간에 애니메이션이 멈추게 됩니다. 코드 이전에 사용했던 슬라이드 애니메이션을 활용하여 stop() 메서드를 사용해 보겠습니다. 슬라이드 멈추기아래로 슬라이드위로 슬라이드Hello world! 슬라이드 멈추기 버튼 아래로 슬.. 2023. 3. 31. [jQuery] 슬라이딩 애니메이션 예제: 부드러운 슬라이딩 효과로 콘텐츠를 전환하는 방법 설명 jQuery의 슬라이드 효과를 사용하면 좀 더 다채로운 웹 페이지를 만들 수 있습니다.이 포스팅에서는 jQuery의 슬라이드 애니메이션에 대해서 자세히 알아보도록 하겠습니다. 먼저, jQuery에는 3가지 슬라이드 효과를 줄 수 있는 메서드가 있습니다.3가지 슬라이드 효과의 종류는 아래와 같습니다. slideDown()slideUp()slideToggle() slideDown은 아래로 슬라이드 되는 것이고, slideUp는 위로 슬라이드 되는 것입니다.slideToggle는 클릭할 때의 상태에 따라 위로 혹은 아래로 슬라이드 됩니다. $(selector). slideToggle(speed, callback); 문법은 위와 같이 사용합니다. speed 위치에는 "slow", "fast" 또는 밀리초가.. 2023. 3. 9. [PHP/html] 간단한 로그인 시스템 구현 예제 어떤 웹페이지라도 빼먹을 수 없는 시스템 중 하나가 로그인 시스템입니다.회원 개인의 정보를 저장하고 확인하기 위해서는 로그인 시스템이 필수적입니다.이번 포스팅에서는 간단한 로그인 시스템을 PHP로 구현하는 코드를 작성해 보겠습니다. MySQL 데이터베이스 먼저, MySQL 데이터베이스에 users 테이블을 생성합니다. users 테이블은 다음과 같은 필드를 갖습니다. id INT(11) NOT NULL AUTO_INCREMENT,username VARCHAR(50) NOT NULL,password VARCHAR(255) NOT NULL,PRIMARY KEY (id) 그리고 users 테이블에 적절한 사용자 정보를 추가합니다.예를 들어, username이 "철수"이고 password가 "1234"인 .. 2023. 2. 23. [HTML/PHP] 간단한 게시판 만들기 #5 (상세페이지/수정/삭제) 간단한 게시판 만들기 5번째 글입니다.이제 작성된 게시판의 상세페이지와 글의 수정 및 삭제 기능을 추가해 보겠습니다.작성된 글을 확인할 수 있는 페이지, 그리고 본인이 작성한 글은 수정할 수 있는 기능이 들어있어야 게시판일 것입니다. CSS 수정 게시판의 상세페이지에서 삭제 버튼을 추가할 생각이라 기존에 게시판 목록에 있던 삭제버튼은 제거하여 주고,글쓰기 버튼을 아래쪽으로 내렸습니다. 살짝 어두운 느낌으로 가는 게 더 좋아 보여서 색상도 조금 변경해 주었습니다. 게시판 상세 페이지 이제 게시판 상세 페이지를 만들어 보겠습니다. test_page.phpfetch($res)) { ?> '> .. 2023. 2. 9. [HTML/PHP] 간단한 게시판 만들기 #3 (검색기능) 간단한 게시판 만들기 3번째 글입니다.이전 포스트에 이어서 이번에는 게시판의 필수 기능 중 하나인 검색 기능을 추가해 보겠습니다.검색 기능을 통해 내가 원하는 게시글이 있는지 빠르게 찾을 수 있으므로 검색기능은 필수적으로 추가해 보도록 하겠습니다. HTML 서치바 틀 만들기 먼저 검색할 텍스트를 입력할 서치바를 만들어 줍니다.css는 나중에 맘에 드는 형식으로 수정해 보겠습니다. 일단은 네모 박스를 만들어줍니다. Jongs 게시판 " method="POST" style="display: inline;"> "> 위 코드처럼 텍스트 박스를 만들어 준 뒤 name을 notice_search_text로 지정해.. 2023. 1. 31. 이전 1 2 다음 728x90 반응형
