web/jQuery (16) 썸네일형 리스트형 jquery masonry masonry란 벽돌로 건축하는것는 것을 뜻한다. 원본 : http://desandro.com/demo/masonry/docs/ (라이센스는 jquery 에 있다고 명시되어 있다.) The MIT LicenseCopyright © 2010 David DeSandro 아래 그림을 보는게 훨신 빠르겠다. 문단을 위와 같이 벽돌 모양으로 하는 것. jquery 를 하다가 잼있는 라이블러리를 찾아서 해볼려고 한다. (실패 할수도 잇음..;; 아직 않해봐서 실시간으로 해서 올리는중?) 먼저 css만으로 문단으로 나눠 보았다. Masonry 1 Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris. 2 Nullam malesuada era.. jQuery hide() show() 123 456 1. 보이기 누른 상태(혹은 초기상태) 2. tr 감추기 버튼을 누른 상태(위의 첫번째 줄이 사라진다.) 3. td감추기 버튼을 누른 상태(아래의 5가 사라진다.) 4. tr감추기와 td감추기를 누른 상태 hide() 함수는 선택한 엘레멘트가 show 상태일때 화면상에서 숨기는 역활을 한다. show() 함수는 선택한 엘레멘트가 hide 상태일 경우 화면에 보여주는 역활을 한다. jQuery after() prepend() after()는 선택된 엘레멘트의 뒤에 html을 추가한다. prepend()는 선택된 엘레멘트의 앞에 html을 추가한다. 중간 jQuery click() 1 2 3 너무나 당연한 거겠지만 click 는 마우스 클릭에 대한 이벤트 이다. 마우스 클릭시 행동할 프로세서만 넣어주면 끝. 여기서는 alert로 선택한 엘리먼트의 값을 가져와서 뿌리도록 했다. jQuery val() 두번째 1 2 3 4 5 6 val(value) 함수는 선택한 엘리먼트의 val을 바꿔줍니다. 여기선 select의 값을 가져와서 그 값을 text 문에 넣는 방식입니다. jQuery val() 오! 이걸 원했음.ㅋ 선택한 엘리먼트의 값을 가져오는 함수 val() 1 2 3 4 5 6 셀렉트를 선택 할때마다 밑의div 에 값을 출력하도록 하였다. $('select#val option:selected').val() 에서 보는바와 같이 select 의 id 가 val 인 엘레먼트의 selected 된 값을 val()을 통해 가져온것을 text로 뿌려주는 것! javascript로 하면 몇줄 쓸텐데...좋긴 좋타+_+ jQuery prev() next() First Second Third prev()는 선택된 엘리먼트의 앞에 next()는 엘리먼트의 뒤를 뜻한다. jQuery insertAfter() 1. element를 셀렉터로 선택한 element 다음 위치로 이동 시킬수 있다. 2. 선택한 element의 다음위치에 원하는 element를 넣을수 있다. test1 Follow me! test1()의 경우 태그를 태그 뒤로 위치 시켜 준다. test2()의 경우 태그 뒤에 새로운 태그를 삽입시켜 준다. test1 부터 일어나기 때문에 뒤에 발생한 test2()에 의해 태그 사이에 새로운 태그가 들어간 것을 볼수 있을겁니다. 이전 1 2 다음
