본문 바로가기
반응형

분류 전체보기126

농구게임 만들기 책을 보며 만든 농구게임입니다. 컴퓨터와 사용자가 번갈아 슛을 하고, 컴퓨터의 2,3점 슛은 랜덤으로 발생합니다. 2점슛이 들어갈 확률은 50%, 3점슛은 33% 으로 되어있습니다. 남은 슛 횟수 10 컴퓨터 0 사용자 0 컴퓨터부터 시작합니다. 컴퓨터 슛하기 사용자 2점 슛 3점 슛 var shotLeft = 10; var shotLeftNum = $('#shot_left'); var computerTurn = true; var txt = $('#txt'); var btnShootComputer = $('#shoot_computer'); var comSroreNum = $('#computer_score'); var comScore = 0; var btnShootUser2 = $('.btn_user2').. 2019. 9. 26.
스코프(Scope) 자바스크립트에서 스코프란 어떤 변수들에 접근할 수 있는지를 정의합니다. 스코프엔 두 가지 종류가 있는데요, 전역 스코프(global scope)와 지역 스코프(local scope)가 있습니다. 전역스코프(Global Scope) 변수가 함수 바깥이나 중괄호 {} 바깥에 선언되었다면, 전역 스코프에 정의된다고 합니다. 전역 변수를 선언하면, 여러분의 코드 모든 곳에서 해당 변수를 사용할 수 있습니다. 심지어 함수에서도 말이죠. const hello = 'Hello CSS-Tricks Reader!' function sayHello () { console.log(hello) } console.log(hello) // 'Hello CSS-Tricks Reader!' sayHello() // 'Hello CS.. 2019. 9. 26.
호이스팅(Hoisting) var 변수의 의도치 않은 현상 if(true){ var name = 'hj'; } console.log(name); //hj for(var i=0; i 2019. 9. 26.
아이폰 버튼 효과 HMTL + CSS3로 아이폰 버튼 효과를 만들었습니다. 동의 거부 .btn_wrap { padding: 50px; } .btn_wrap label { font-size: 30px; } .btn { display: inline-block; position: relative; background: #b2b2b2; border-radius: 30px; width: 100px; height: 50px; cursor: pointer; vertical-align: middle; transition: all 0.3s; } .btn:after { content: ""; display: block; position: absolute; left: 0; top: 0; width: 48px; height: 48px; bor.. 2019. 9. 26.
제이쿼리로 슬라이드 만들기 제이쿼리로 간단한 슬라이드를 만들었습니다. PREV NEXT * { margin: 0; padding: 0; list-style: none; box-sizing: border-box; } span { margin: 0 20px; font-size: 20px; } #slider { position: relative; width: 640px; height: 480px; overflow: hidden; } #slider li { display: none; position: absolute; left: 0; top: 0; } #slider img { display: block; } #slider li:first-child { display: block; } $('#next').click(function(){ s.. 2019. 9. 26.
is()로 요소 검사하기 selector, element 에 대해 일치하는 요소를 검사하고 그 중 하나 이상이 일치하면 true를 반환합니다. list item 1 - one strong tag list item 2 - two strong tags list item 3 list item 4 list item 5 $("li").click(function() { var $li = $(this); var isWithTwo = $li.is(function() { return $('strong', this).length===2; }); if (isWithTwo) $li.css("background-color", "green"); else $li.css("background-color", "red"); }); // 두번째 li를 초록색으로.. 2019. 9. 26.
반응형

티스토리툴바