본문 바로가기

매일코딩/JQuery4

제이쿼리 기초 2 append prepend after before remove empty addClass 1. 과일 목록 사과포도배 append prepend after before remove empty 2. 버튼1 버튼2 결과 표시 3. 1 두번째 div 버튼1 버튼2클래스 추가 버튼결과표시 4. 1 2 3 4 5 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812.. 2016. 12. 27.
제이쿼리 기초1 mouseover text focus css blur show hide toggle animate fadeOut slideUp 1. 클릭하면 사라집니다 2. 마우스를 여기로 움직이세요.0 3. 아이디 4. 5. 표시 숨김 toggle 애니메이션 페이드 인 페이드 아웃 slide down slide up 6. 이것은 하나의 단락입니다. 버튼1 버튼2 7. 이름 : 확인 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231.. 2016. 12. 26.
JQuery hover&find&append&click&dblclick&focus 2 구조는 거의 항상 다음과 같습니다: $(document).ready(function() { $('thingToTouch').event(function() { $('thingToAffect').effect(); });}); ex) MESSAGE: Add! $(document).ready(function() { $('button').click(function() { var toAdd = $("input[name=message]").val(); $('#messages').append(""+toAdd+""); });}); ------------- document가 .ready() 되는 순간 효과가 발생하는 코드 -- html -- js $(document).ready(function(){ $('div').fad.. 2016. 12. 16.
JQuery DOM&mouseenter&mouseleave&fadeTo 1 #.문서 객체 모델 (DOM) HTML 문서는 DOM(문서 객체 모델)을 통해 구성되어있습니다.바로 이 DOM이 jQuery와 상호작용하며 HTML을 수정 가능할 수 있도록 합니다. #.jQuery의 구문 function(){ jQuery magic;} $(document).ready(function() { jQuery 문장;}); ----------------- Hello world! css div { position: absolute; margin: -10px 0 0 -8px; height: 60px; width: 100%; background-color: #008800; color: #FFFFFF; font-family: Verdana, Arial, Sans-Serif; display:none;} .. 2016. 12. 15.