code snippet

dragable

jquery-ui.min.js 파일 필요.

$('.layerPopup').draggable();

option = () 안에 revert:true //자기자리로 이동 cotainment:’parent’ //부모 위치영역만큼 이동, ‘parent’대신에 상위 id를 주면 범위 설정 cursor:’move’ // cursor 속성은 드래그 하는 동안 마우스 포인터 모양을 변화시킴. ‘cancle’ // 클래스? opactiry:0.7 //드래그 하는 동안 불투명도

// dragtest이벤트는 드래그가 시작하면 발생 $(“.draggable”).bind(“dragstart”,function(event, ui){

// invert 클래스가 적용되어 배경 이미지가 변경됨 $(this).addClass(“invert”); });

// dragstop이벤트는 드래그가 멈추면 발생 $(“.draggable”).bind(“dragstop”, function(event, ui){

// invert 클래스가 제거되어 원래 배경이미지로 돌아감 $(this).removeClass(“invert”); });

es6이후의 jquery $(this)대체용.

$('div).on('click,'function(e){
	var $el = $(e.curruentTarget);
})

이미지 원본사이즈 크기 대로 사이즈 맞추기

img = document.body.appendChild(document.createElement('img'));
img.src = $('.card-front img').attr('src');
	var h = img.offsetHeight;
	document.body.removeChild(img);
//alert(h);
$('.card-front img').height(h);

각각의 이미지 사이즈 만큼 높이주기

 $(".card-front img").each(function(){
       $(this).closest("li").css("height",$(this).height());
    });

숫자 천 단위 콤마 찍기

function add_comma(num){ 
 var returnVal = String(num); 

 while(returnVal.match(/^(-?\d+)(\d{3})/)){ 
  returnVal = returnVal.replace(/^(-?\d+)(\d{3})/,'$1,$2'); 
 } 
 return returnVal; 
} 

num = add_comma('10000'); 

탭

$('.contentNav li').click(function(e){
e.preventDefault();
  var idx = $(this).index();
  $('.contentNav li').removeClass('active').eq(idx).addClass('active');
  $('table').removeClass('active').eq(idx).addClass('active');
 });

유튜브 영상 iframe 설정

//유튜브 주소 변환 - 'url'로 올렸을 시
function convertor2(global_movieSrc){
   var cut = global_movieSrc.split('/');
   var Src = cut.reverse();
   var Src2 = Src[0].split('=');
   var url = 'http://www.youtube.com/embed/'+Src2[1];
   console.log('컨버터로 나온값 : '+url);
   $('.youtube iframe').attr('src',url);
}

//유튜브 주소 변환
function convertor(global_movieSrc){
	var cut = global_movieSrc.split('/');
	var Src = cut.reverse();
	var url = 'http://www.youtube.com/embed/'+Src[0];
	console.log('컨버터로 나온값 : '+url);
	$('.youtube iframe').attr('src',url);
}
//유튜브 닫을시 동영상 정지
$('.youtube .popup__close').click(function(){
	
	$('iframe').attr('src',global_movieSrc+'?disablekb=1');
});

ckeditor4 에디터부분 수정, 보기 토글하기

<h3>CKEditor 4:</h3>
<input type="button" onclick="switcher()" id="reinit_editor" value="reinit editor" />
<br/>
<textarea id="editor1">Test</textarea>

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ


var l = 0;

function switcher() {
    if (l == 0) {
        CKEDITOR.replace('editor1');
        l=1;
    } else {
        CKEDITOR.instances.editor1.destroy();
        l=0;
    }
}