반응형

HTML

 

CSS
/* 프로그래스 바 CSS */

.Progress_Bar {width: 100%;height: 100%;top: 0px;left: 0px;position: fixed;display: block;opacity: 0.7;background-color: #fff;z-index: 99;text-align: center;}
.Progress_Bar_Image {position: absolute;top: 50%;left: 50%;z-index: 100;}

 

JS

$(window).load(function(){
      $("#Progress_Bar").hide();
});

 

$("#Progress_Bar").hide(); 중요.
※Progress_Bar를 버튼 혹은 function에서 Show 시켜주고 마지막에 hide 시켜주면 됨 .

 

 

반응형

[2021.05.07]

Input 박스에 X 표시를 넣는 방법 입니다.

X 표시를 넣었다고 해서 데이터가 삭제되거나 그러지는 않습니다.

 

HTML

<input id="TEST_ID" class="input_FontSize form-control form-control-sm " autocomplete="off" type="text" />
<span class="searchclear" style="display:none">X</span>

 

CSS

.TEST_ID[type=text]:-ms-clear{display: none;}
.searchclear {position: absolute;right: 6px;top: 7px;bottom: 15px;width: 10px;height: 14px;margin: auto;font-size: 15px;cursor: pointer;color: #ccc;background-color: #fff;}

 

JavaScript (Jquery)

$(document).on("keyup",".searchclear",function () {
	$(".searchclear").toggle(Boolean($(this).val())); //영역 
});

 

+ Recent posts