Form JS 팝업 프롬프트 효과 code_form 효과

HTML

코드 복사 코드는 다음과 같습니다.

; /form>

페이지 스타일

코드 복사 🎜>

Key JS




코드 복사


코드는 다음과 같습니다.


$(function() {
$(".input ,.login_input,.textarea").focus(function() {
$(this).addClass("focus");

}).blur(function() {
$(this).removeClass("focus");
});

//입력 상자 프롬프트, HintTitle, HintInfo 속성을 사용하여 객체 가져오기 $("[HintTitle],[HintInfo] ").focus(function( event) { $("*").stop(); //실행 중인 모든 애니메이션을 중지합니다$("#HintMsg").remove(); //먼저 지우고 반복되는 오류 방지var HintHtml = "

• " $(this).attr("HintTitle") "" $(this).attr("HintInfo") "

"; //표시된 내용 설정var offset = $(this).offset(); //이벤트 객체의 위치 가져오기$("body").append(HintHtml ); //노드 추가

$("#HintMsg").fadeTo(0, 0.85); //객체의 투명도

var HintHeight = $("#HintMsg").height(); 컨테이너 높이 가져오기
$( "#HintMsg").css({ "top": offset.top - HintHeight "px", "left": offset.left "px" }).fadeIn(500)
}).blur(function( event) {
$("#HintMsg").remove(); //UL 삭제
})



렌더링:




위 내용은 다운로드 사이트에서 가져온 내용으로 구체적인 이름은 잊어버렸습니다.... 참고용으로만 사용하세요