본문 바로가기
728x90
반응형

HTML22

[jQuery] 애니메이션이나 효과를 중지 시키는 stop() 개요  이전 포스팅에서 아래로 슬라이드와 위로 슬라이드, 트리거 사용을 해보았는데요.이번에는 슬라이드 같은 애니메이션을 사용할 때 애니메이션을 나는 그만보고 싶다. 혹은 웹게임을 만들 때, 움직이는 몬스터들에게 꼼짝 못 하게 하는 기능 등 이런저런 상황에서 사용될 수 있는 제이쿼리의 stop() 메서드에 대해서 알아보도록 하겠습니다.   동작 화면   동작하는 이미지는 위와 같습니다.아래로 슬라이드를 눌러서 슬라이드 애니메이션이 작동중일 때,슬라이드 멈추기 버튼을 누르면 작동하는 중간에 애니메이션이 멈추게 됩니다.  코드 이전에 사용했던 슬라이드 애니메이션을 활용하여 stop() 메서드를 사용해 보겠습니다. 슬라이드 멈추기아래로 슬라이드위로 슬라이드Hello world!  슬라이드 멈추기 버튼 아래로 슬.. 2023. 3. 31.
[jQuery] 정규식을 활용한 이메일과 비밀번호 유효성 검사 소개 이메일과 비밀번호를 입력하는 웹페이지가 있다는 가정하에 양식을 제출하기 전에 jQuery를 사용하여 사용자 입력의 유효성을 검사한다고 가정해 보겠습니다. 특히 사용자가 특정 기준을 충족하는 유효한 이메일 주소와 암호를 입력했는지 확인하려고 합니다. 이를 위해 양식에서 제출 이벤트를 수신하는 jQuery 함수를 작성한 다음 이메일 및 비밀번호 입력 필드의 값을 확인합니다.필드가 비어 있거나 지정된 기준을 충족하지 않는 경우 함수는 오류 메시지를 표시하고 양식이 제출되지 않도록 합니다.   코드 $(document).ready(function() { // 양식에서 제출 이벤트 수신 $('form').submit(function(event) { // 이메일 및 비밀번호 입력 필드의 값 가져오기.. 2023. 3. 3.
[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.
[jQuery] 파일 첨부 시 미리보기, 파일 확장자명 판별하기 html 코드를 사용하여 파일을 첨부할 때 보통 input type = "file"를 사용하여 파일을 첨부합니다.이때 파일만 첨부되고 어떤 파일이 첨부 되었는지 알 수가 없습니다.이미지 미리보기가 된다면 어떤 파일을 첨부했는지 쉽게 알 수 있을 것입니다. 이번 글은 첨부한 이미지파일을 미리 볼 수 있는 미리 보기 기능에 대해 작성해 보겠습니다.    작업할 내용    아래 파일 선택을 눌러서 파일을 첨부하면 위쪽에 미리 보기로 첨부한 이미지가 올라가게 됩니다.첨부한 파일명은 파일 선택 바로 옆에 표기되게 되고,오른쪽의 첨부하기 버튼을 누르면 파일을 저장하게 됩니다.  이미지 미리 보기 코드  가끔 페이지를 공격하여 정보를 빼내가려는 사람들은 파일 첨부기능에 자신들의 코드가 작성된 파일을 첨부하기도 합니다.. 2023. 2. 14.
728x90
반응형