All
[제이쿼리] 현재 위치에서 팝업창 가운데로 띄우기
스크롤 바를 내린 상태에서 팝업 창을 띄우면 상단에 팝업창이 생기는 문제가 발생할 수 있다. "top": (($(window).height()-$("#popupDiv").outerHeight())/2+$(window).scrollTop())+"px""left": (($(window).width()-$("#popupDiv").outerWidth())/2+$(window).scrollLeft())+"px" 위 공식을 사용하면 현재 위치에서 가운데에 팝업창을 띄울 수 있다. $("body").css("overflow","hidden");//body 스크롤바 없애기 $("body").css("overflow","auto");//body 스크롤바 생성 body의 overflow를 건드는 이유는 팝업창을 띄운 고정..
[스터디] 2018.03.22 GIT 스터디1
git강의https://backlog.com/git-tutorial/kr/intro/intro1_1.html git 사용법https://nolboo.kim/blog/2013/10/06/github-for-beginner/ git명령어http://noritersand.tistory.com/86 git설치http://library1008.tistory.com/51 git hub사용법http://blog.naver.com/PostView.nhn?blogId=nicecoding&logNo=220590027939&categoryNo=32&parentCategoryNo=23&viewDate=¤tPage=1&postListTopCurrentPage=1&from=postView ----------------..
[제이쿼리] hover -> .stop(true,true)
*위쎈(http://www.bulgariswissen.com/weissen1707/index.asp)페이지 상단 네비부분 호버했을 때 서브네비가 내려와야 함.처음에 마우스리브를 썼었는데 마우스가 왔다갔다 하는 액션을 다 받아서서브네비가 메롱거림... => 클릭 시 버블링 막아주고, .stop(true,true) 넣어주면 괜찮아진다. 기억하기~! $('#header .gnb .health_nav').hover(function(e){ e.preventDefault(); e.stopPropagation(); $(this).children('a').stop(true,true).addClass('on'); $(this).children('ul').stop(true,true).slideDown(); },functi..
[플러그인] 탭안에 슬라이드, 영역 밖의 화살표 => slick
https://github.com/OwlCarousel2/OwlCarousel2/issues/1139 2018.03.14 탭안에 슬라이드를 넣는중 사용한 OwlCarousel탭을 클릭할때마다 위드값을 이상하게 받아온다.반응형이라 창 크기를 줄이면 제 값을 가져오는데 첫 화면에서 탭을 클릭하면 이상하다.그래서 swiper로 바꿨다. swiper는 잘된다.안되는 플러그인은 에러사항을 메모해두고 다른걸로 갈아타자.다음에 업데이트 되겠지. 2018.03.15 하단 이미지와 같이 스와이퍼 영역을 벗어난 화살표가 필요했다. swiper는 화살표 마크업이 따로 필요하기 때문에, 해당 영역을 벗어나는 화살표는swiper 밖으로 화살표 마크업을 빼고, swiper와 화살표를 감싸는 박스에 position:relative..
[HTML] View Port(뷰포트 설정)
- 뷰포트란 전체 웹 페이지 가운데 브라우저 창에 보이는 부분을 말한다.- 모바일 브라우저에 대응하는 html문서의 head안에 viewport를 설정한다.- 브라우저와 해상도에 따라 다르게 설정한다. - width=device-width; 가로 화면 전환시 화면에 맞게 페이지 폭이 넓어지게 된다. 쓰지 않을 경우 화면이 폭에 맞추어 확대됨. device-width 옵션은 iPhone OS 1.1.1 이후 적용. - initial-scale=1.0; 초기화면을 해당 비율로 확대하여 보여주는 옵션- maximum-scale=1.0; 확대할 수 있는 최대값 (범위 0~10.0) 디폴트값은 1.6- user-scalable=yes; 사용자가 화면을 확대할 수 있도록 허용 - 등록되는 웹 사이트의 아이콘 지정...
[제이쿼리] 콜백 함수
jQuery 콜백 함수 JavaScript 문은 한 줄씩 실행됩니다. 그러나 효과를 사용하면 효과가 완료되지 않은 경우에도 다음 코드 줄을 실행할 수 있습니다. 이로 인해 오류가 발생할 수 있습니다. 이를 방지하기 위해 콜백 함수를 만들 수 있습니다. 콜백 함수는 현재 효과가 끝난 후에 실행됩니다.
[CSS] word-break 속성과 word-wrap 속성
출처 : http://wit.nts-corp.com/2017/07/25/4675 word-break : 단어의 분리를 어떻게 할 것인지 결정한다.word-wrap : 박스의 가로 영역을 넘친 단어 내에서 임의의 분리 여부를 결정한다.
[자바스크립트] 자바스크립트 정리
1. 변수 만드는 규칙 - 영문자, 숫자, _- 숫자로 시작할 수 X- 특수문자로 시작할 수 X- 공백은 허용되지 X- 자바스크립트 문법안에서 규정한 예약어(키워드)는 변수로 사용할 수 X 2. 연산자 1(산술, 대입, 증감, 비교연산자) - 산술연산자 - 대입연산자 - 증감연산자++, -- -비교연산자 3. 연산자 2(논리연산자, 비트, 삼항 연산자, 기타연산자) -논리연산자
[SVG] clip-path
예제 : https://css-tricks.com/clipping-masking-css/ 클립패스 만들어주는 사이트 : https://bennettfeely.com/clippy/ 클립패스 정의 : https://developer.mozilla.org/ko/docs/Web/CSS/clip-path https://jsfiddle.net/Kimara/a8xwvhxc/
handlebars.js[jsfiddle]
출처 : http://programmingsummaries.tistory.com/381 https://jsfiddle.net/Kimara/fmt4yftp/