전체 글

이미지 슬라이드 만드는 순서는 다음과 같다. 1. 먼저 html 과 css로 이미지를 만들어준다. 2. 자바스크립트로 버튼을 누르면 화면이 옮겨지는 기능을 추가한다 참고로, 아래 기능은 화면이 흘러넘칠때 자동으로 생기는 스크롤을 없애준다 -html 1 2 3 -javascript css 에서 클래스를 탈부착하는 방식으로 화면을 이동시킬수도 있지만, 이동시키는 값 ( 'translateX(-100vw)' => 굵은글씨)을 항상 변화시키려고 하기 때문에 자바스크립트를 사용해보겠다 100vw는 현재브라우저 화면이 꽉찬 폭이다. 따라서 -100vw 면 현재 화면 폭만큼 왼쪽으로 이동한다는 의미이다 //1번 버튼 클릭시 1번사진이 보이는 transform 기능을 추가해주세요 $(".slide-1").on('cli..

/정규식/.test(정규식으로 검사해볼문자) /abc/.test('abcdef') 아무 문자나 뒤에 .test() 붙일 수 있습니다. 그럼 문자에 찾을 단어가 들어있는지 검사해주고 있으면 true / 없으면 false 남겨줍니다. $('form').on('submit',function(e){ var 입력한값 = document.getElementById('email').value; if ( /\S+@\S+\.\S+/.test(입력한값) ){ alert('이메일형식아님') e.preventDefault(); } }); 1. 제출버튼을 눌렀을때 변화가 생기도록 2. 입력한 값을 먼저 변수에 담아주고 3. 입력한 값을 test()에 담아 검증 4. 알림창띄움 5. 다음페이지로 넘어가기 방지 문제: 폼 전송시 ..

(힌트) 5라는 문자만 5 이걸로 감싸면 html 조작하기 쉬워집니다. 변수 초기값을 먼저 밖에 선언하고, 변수가 얼마씩 줄어들지 알려줌 변수가 0보다 클때까지 카운트 다운 선언 setInterval() 함수는 몇초마다 변화를 일으킬때 자주 쓰임! 5초 이내 구매시 사은품 증정 (참고) 타이머를 삭제하고 싶으면 var 타이머 = setInterval(어쩌구); 이렇게 변수에 저장해둔 다음 타이머 삭제하고 싶을 때 clearTimeout(타이머) 이 코드 실행하면 됩니다.

로그인하세요 전송 닫기 Navbar An item A second item A third item A fourth item And a fifth one Shirts on Sale 로그인 번외 태그에서 발생하는 이벤트들이 있습니다. input이벤트와 change 이벤트인데 안에 뭔가 입력할 때 발생합니다. 내용을 입력할때나 변화가 생길때 쓸수 있는 이벤트리스너입니다 document.getElementById('email').addEventListener('input', function(){ console.log('안녕') }); document.getElementById('email').addEventListener('change', function(){ console.log('안녕') });

Hello, world! // //1. html,css 로 미리 디자인 //2. 버튼 누르면 보여주셈

다음 html,css 자료들은 부트스트랩에서 따왔다 //html 로그인하세요 닫기 로그인 //css .black-bg { width : 100%; height : 100%; position : fixed; background : rgba(0,0,0,0.5); z-index : 5; padding: 30px; } .white-bg { background: white; border-radius: 5px; padding: 30px; } .noshow { display:none; } 자바스트립트로 클래스를 추가하거나 삭제하는 방법으로 모달창을 띄우거나 없앨수 있다. UI 애니메이션 제이쿼리 문법을 사용했다. 제이쿼리를 이용하면 애니메이션을 쉽게 사용할 수 있다. 자연스럽게 모달창이 서서히 뜨고, 없어지게 만들수..

제이쿼리는 기존에 있는 자바스크립트를 간편하게 사용할 수 있도록 하는 라이브러리이다. 새로운 컴퓨터 언어는 아니다 $('셀렉터')로 찾으면 jQuery함수만 붙을 수 있음 querySelector('셀렉터')로 찾으면 자바스크립트함수만 붙일수 있음 $('.hello').innerHTML = ㄴㄴㄴㄴㄴㄴ 안녕 버튼

alert 박스 내용 바꿔서 띄우기 1. 태그 내용을 아이디입력으로 바꿈 2. alert 띄움 기존에 있던 alert 박스를 재사용 버튼1 누르면 alert 박스 안의 제목을 "아이디입력하세요" 로 바꾸고 alert박스 띄우기 버튼2 누르면 alert 박스 안의 제목을 "비번입력하세요" 로 바꾸고 alert박스 띄우기 알림창임 닫기 버튼1 버튼2