겉바속촉

이번에는 onchange를 연습해보도록 합시다:) 우선 html파일 3개를 만들어주세요 그 다음 이미지를 넣고 select로 이동시켜볼게요 select1 select1페이지입니다 select2 select2페이지입니다 select3 select3페이지입니다 main 블럭 사이에 을 만들어주세요 그리고 를 주실 건데요 ---> onchange 를 적용시켜주시는 겁니다. 선택하세요 페이지1로 이동 페이지2로 이동 페이지3로 이동 컴파일해보시면 다음과 같은 창이 실행이 됩니다. 선택하세요 박스 클릭하시면 다음과 같이 목록이 뜹니다:) 코드에서 작성한 각각의 value값들인 거쥬 페이지1로 이동 누르면 페이지2로 이동 누르면 페이지3로 이동 누르면 각각 잘 작동했다면 성공!^^!

이번 목표는 1. 마우스 이벤트 객체 2. id값 지정한 곳에 출력해내기 먼저 마우스 이벤트에 대해서 만들어볼게요:) 사진 두장을 가지고 왔어요!! 마우스를 올렸을 때, 내렸을 때 사진에 변화가 오도록 코드를 작성해보려고 합니다:) 이따가 id값에 대해서 만들기 위해 버튼도 미리 작성해두었습니다 마우스를 올렸을 때 --> onmouseover 마우스를 내렸을 떄 --> onmouseout 그리고 컴파일 해보시면!! 마우스 안 올렸을 때 마우스 올렸을 때 이제 click me 에 대해서 효과주기 촛불 사진 위에 click me라는 button을 아까 만들어두었죠?? 그걸 클릭하면 안녕하세요가 뜨게 해볼게요 바로 id 지정한 곳에 뜨게 하는 방식입니다:) 버튼 누르면!! 다음과 같이 뜨는 게 보이시쥬?! 이..

이번에는 popup창을 만들어보도록 할게요!! 1. 자바스크립트 소스 파일 생성! 2. function 작성 window. open( url, 이름, 스펙) --->이렇게 해주시면 됩니다:) pop1과 pop2에 대해서 function 만들어주세요 pop1은 갖고있는 이미지가 뜰 수 있도록 pop2는 naver사이트로 이동될 수 있도록 만들고 싶습니다:) 코드와 함께 확인해주세요~ popup.js /** * */ //웹브라우져 새창열때 가장 간단(url, 이름, 스펙) function pop1() { window.open('../image/popup3.jpg','Event','width=430,height=430,scrollbar=yes,status=no'); } function pop2() { wind..

이번에는 재미있게 수강신청 했는지 물어보는 html을 꾸며봅시다:) 다음과 같이 우선 코드를 작성해주세요 질문은 태그를 활용해주시구요 수강신청 하셨나요? 수강신청확인 을 활용해서 이름을 넣어주었습니다 이라고 해주었구요:) 을 활용하시면 다음과 같은 결과가 나옵니다 이제 button을 만들어주세요 예, 아니오 가 써져있는 button입니다:) 수강신청 하셨나요? 수강신청확인 컴파일 해보시면 다음과 같이 나옵니다:) 이제 예 아니오 누르면 무언가 변화가 생기게 해주고싶어요:) 그럼 자바스크립트 활용해주시면 되겠쥬? function 2개를 각각 만들고 onclick에 소환해주세요! 전체 코드블럭은 수강신청 하셨나요? 수강신청확인 예 누르면 아니오 누르면

스크립트 안에다가 sampleConfirm명을 가진 함수를 만들었습니다:) 이 함수는 if문을 활용해줄게요 그래서 좋아요? 라고 물어봤을 때 확인 , 취소를 누른 결과가 alert창으로 뜨게 해줄게요! 다음과 같이 작성해주세요:) body부분을 보시면 button을 하나 만들었죠?? button에 써져 있는 값은 click me!! 라고 주었습니다:) click me 를 누르면 이동하게 해주려고 onclick="" 이라고 넣어줍니다 그리고 스크립트에서 작성해준 함수를 불러오는 거에요:) onclick에다가!!!!!!!!!!!! 완성된 전체 코드블럭 확인 누르면 취소 누르면

우선 함수의 종류에 대해서 알아보도록 할게요:) 1. 파라메타 와 리턴값이 없는함수 function 함수이름() { } 2. 파라메타 만 있고 리턴값이 없는함수 function 함수이름(pa1,pa2){ } 3. 파라메타 와 리턴값이 있는함수 function 함수이름(pa1,pa2){ return 반환값; } 함수명 형태에 따른 분류 1. 가장 기본적인 함수 function hello(){ document.write("자바스크립트 시작~"); } hello(); 2. 리터럴 방식-->함수명=function 형태 hello2= Function(){ document.write("리터럴 방식 함수 만들기"); } hello2(); 3. 이름없는함수...주로 어떤 내용을 외부와 완전히 분리시킬때 (functio..

이번에는 형변환에 대해서 알아보도록 하겠습니다. 다음과 같이 코드를 작성해주세요~ 여기서 사용하는 prompt는 두개의 인수를 받습니다. 실행이 되면 메세지, 입력란, 확인, 취소 버튼이 있는 창이 뜹니다. var num=prompt("메세지내용", "기본값"); /* prompt는 문자만 출력 */ var num=prompt("숫자입력", "0"); document.write(typeof(num)); 컴파일을 해보시면 다음과 같이 뜨게됩니다. 입력란에 숫자를 입력해보니 다음과 같이 string 이라고 뜨네요:) 이번에는 다음과 같이 코드를 작성해주세요 prompt를 또 이용해볼게요:) 수를 3가지 입력할 수 있도록 해볼거에요 그래서 3가지의 수 합이 나올 수 있게 해볼게요!! 여기서 포인트는 promp..

설치해주셔야 될게 있어요 아래링크 복사하신 후에 http://oss.opensagres.fr/tern.repository/1.2.0/ Index of /tern.repository/1.2.0 oss.opensagres.fr 이클립스 들어가시고 프로젝트 파일에서 우클릭 - Configure - Covert to Tem Project.. 클릭 그리고서 뜨는 팝업창에서 체크해주세요:) 체크할 사항들---> Browser, CKEditor, jQuery 세가지 체크체크체크 해주세요:) 그리고 Apply and Close 해주시면 됩니다~ 이제부터 자동완성이 가능합니다!^^! 지금부터 자바스크립트 시작입니다!! 오예!! alert이용해서 경고창이 뜨게 해줄게요:) 다음 코드를 살펴 보시면 바로 다음줄에 까지 치시..

이제 audio랑 video도 넣어볼 줄 알아야합니다:) 먼저 audio로 음악듣기를 해볼게요?? html파일 하나 생성해주신 후에 body사이에 다음과 같이 코드 작성해주세요 html5에 추가된 Audio&Video Audio로 음악 듣기 이미지 파일 넣어주듯이 가지고 계신 오디오파일 복사하신 후에 폴더에 붙여넣기 해주세요:) 그 다음 라고 해주시는 거에요 우리는 또 음악파일을 컨트롤 해줄 컨트롤 박스가 필요하겠죠?? 그래서 controls="controls"를 추가해주시면 됩니다 전체는 그리고 컴파일 해보시면 다음과 같이 나오것이쥬?! 블럭 하나 더 넣어주세요:) 이제 video 넣어주시면 됩니다!! 다음과 같은 코드를 작성해주시는데요 과정은 오디오 파일을 넣는 과정과 동일합니다. 여기서 포인트는 o..