JQuery 코드
/* 새 창에서 링크 열기: JQuery 필터 속성
* 오른쪽 클릭 메뉴 팝업을 위해 마우스 비활성화: DOM contextmenu
* 맨 위로 돌아가기 페이지: DOM scrollTo
* 동적 대체 CSS 스타일 시트: JQuery filter Element Attribute
* 페이지 글꼴 크기 조정: Css html.css parseFloat
*/
//DOM 로딩이 완료되었는지 확인
$(document).ready(function () {
/* http로 시작하는 링크 href 속성은 새 창에서 링크를 엽니다*/
// ^ 필터, 속성: 다음으로 시작 특정 문자열
$("a[href ^='http']").attr("target", "_blank");
/* 마우스 오른쪽 버튼 비활성화*/
/ /DOM contextmenu는 마우스 오른쪽 버튼 메뉴입니다
$( document).bind("contextmenu", function (e) {
Alert(("No right-clicking!"));
//Does 아래쪽으로 실행하지 않음, 즉 오른쪽 클릭 메뉴가 나타나지 않음
return false;
});
/* 페이지 상단으로 돌아가기*/
/ /id가 "top"인 요소의 클릭 이벤트가
$('#top')을 트리거합니다. click (function () {
// 페이지 위로 가기
$ (문서) . Scrollto (0, 500);
}); CSS 스타일 시트*/
//링크 태그의 href 속성 값을 페이지 링크의 href 값으로 바꿉니다.
$("a.cssSwap ").click(function(){
$( "link[rel=stylesheet]").attr("href",$(this).attr("rel"));
});
/* 페이지 글꼴 크기 확대, 축소, 복원*/
//글꼴 크기 가져오기, 글꼴 크기
는 html 태그 아래에 정의됩니다. var originalFontSize = $("html" ).css("font-size");
//기본 글꼴 크기 복원
$(".resetFont").click(function () {
$("html").css( "font-size", originalFontSize);
//javaScript 아래쪽으로 실행하지 않음
return false;
});
//글꼴을 늘리면 특정 요소의 클래스는 증가Font
$(".increaseFont").click(function () {
//현재 글꼴 크기 접미사 가져오기 px,pt,pc
var currentFontSize = $("html").css ("font-size");
//현재 글꼴 크기를 가져오고,parseFloat()는 float 유형으로 변환하고 접미사를 제거합니다.
var currentFontSizeNumber = parseFloat(currentFontSize);
//새로 정의된 글꼴 크기
var newFontSize = currentFontSizeNumber * 1.1;
//스타일 시트 다시 작성
글꼴을 줄입니다. 요소의 클래스는 감소Font
$(".decreaseFont").click(함수( ) {
//현재 글꼴 크기 접미어 px,pt,pc를 가져옵니다
var currentFontSize = $("html").css("font-size");
//현재 글꼴 크기를 가져옵니다. ,parseFloat()는 이를 부동 소수점 유형으로 변환하고 접미사를 제거합니다.
var currentFontSizeNumber =parseFloat(currentFontSize);
/ /글꼴 크기 재정의
var newFontSize = currentFontSizeNumber * 0.9;
//스타일 시트 다시 작성 JavaScript는 아래쪽으로 실행되지 않습니다
return false;
});
});
Html 코드: