본문 바로가기

WEB/jQuery

jQuery

-공부할때 따로 코딩따로

 

 

 

 

  1. Attr
  2. Prop

 

Slice(0,2) 0,1번째 처리~

 

} .not()

} .parent() :바로위 부모요소

} .parents() :연관된 부모요소들

} .parentsUntil()

} .prev()

} .prevAll()

} .prevUntil()

} .siblings() : 형제요소들

} .slice() :원하는 자료추출

.slice(start[,end])

-------------------------------------------

https://freelec.co.kr/member/login.asp?ToURL=/online/lec_chapter.asp?UID=98

 

 

Bind ->r기능 추가

 

  $('#conn').click(function (){

                    $('#btn').bind('click', function () {

                       /* alert('hello');  

                                */

                        $(this).after("<div>추가내용</div>")          

                                  

                        

          });

 

//on  after

 $('body').on('click',function(){

            $(this).after("<div>click</div>");

        });

           

 

//.trigger()->강제처리.

 

        $(document).ready(function () {

         $('#btn').click(function(){

             $('body').css('backgroundColor','yellow');

            

       

         });

            $('#btn').trigger('click');

        });

 

.mouseenter()

 

출처: <http://api.jquery.com/mouseenter/>

 

마우스에관련된 것들. 따로 정리하고 이해해야함/

 

//접근성있는 화면을 만들땐 ~ tab 혹은 focus 사용하여 접근성을 확대한다.

 

 

.fadeIn(), hide() show()

 

출처: <http://api.jquery.com/fadeIn/>

 

   $(document).ready(function () {

      

            $('div').hide();

             $('#s').on('click',function(){

                

               /*  $('div').show(1000);*/

                

                         $('div').fadeIn(1000);  

                

             });

            $('#w').on('click',function(){

                /*$('div').hide(1000,function(){

                   

                    alert('hide complete!')

                   

                   

                });          */   

                $('div').fadeOut(1000,function(){

                   

                    alert('hide complete!')

                   

                   

                });

               

            });

        });

 

.fadeToggle()

$(document).ready(function () {

            $('#btn').click(function(){

                $('div').fadeToggle(2000);

               

               

               

            });

        });

반복적으로 사라졌다 나타났다함. Fade in fadeout 함께 붙어있는 효과~

 

//easing 다운받고 ~!! 적용하는 해봄.

http://gsgd.co.uk/sandbox/jquery/easing/