지역 사회 배우다 도구 라이브러리 여가
찾다
한국어
집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

Wordpress ThickBox에 '원본 이미지 보기' 효과 code_javascript 기술이 추가되었습니다.

WBOY
풀어 주다： 2016-05-16 18:14:05
원래의
1891명이 탐색했습니다.

wp-includes/js/thickbox/thickbox.js의 39번째 줄에 있는 tb_show(caption, url, imageGroup) 함수에서 다음 줄을 추가합니다(굵은 빨간색 텍스트는 새로 추가된 코드를 나타냅니다)

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

function tb_show(caption, url, imageGroup) {//사용자가 클릭하면 호출되는 함수 두꺼운 상자 링크

try {
/// 코드가 생략되었습니다. . .
TB_NextHTML = "";
TB_imageCount = "";
TB_FoundURL = false
////// 원본 이미지를 표시하려면 새 창을 엽니다
TB_OpenNewHTML = ""; 🎜>
if(imageGroup){
/// 코드 생략. . . < a href='#'>" ThickboxL10n.next "";
} else {
TB_PrevCaption = TB_TempArray[TB_Counter].title;
TB_PrevURL = TB_TempArray[ TB_Counter].href;
TB_PrevHTML = " " ThickboxL10n.prev "";
}
////// 원본 이미지를 표시하려면 새 창을 엽니다
TB_OpenNewHTML = " 원본 이미지 보기";

} else {
　　　　　　　　　　TB_FoundURL =
　TB_imageCount = ThickboxL10n.image ' ' (TB_Counter 1) ' ' ThickboxL10n.of ' ' (TB_TempArray.length)
////// 원본 이미지를 표시하려면 새 창을 엽니다
TB_OpenNewHTML = " 원본 이미지 보기";
}
}
}
}

/// 코드 생략. . .

// 큰 이미지 크기 조정 - 원본: Christian Montoya, 편집:

/// 코드 생략. . .
// 크기 조정 종료

TB_WIDTH = imageWidth 30;
TB_HEIGHT = imageHeight 60
//jQuery("#TB_window").append("" caption " " "
" caption "
" TB_imageCount TB_PrevHTML TB_NextHTML "
< ;div id='TB_closeWindow'>");
/////// 원본 사진을 보려면 새 창에 다음 사진을 표시하세요(TB_OpenNewHTML 추가)
jQuery("#TB_window").append(" " 캡션 "" "
" 캡션 "
" /div>
");


jQuery("#TB_closeWindowButton").click(tb_remove)

if (!( TB_PrevHTML == = "")) {
/// 코드 생략. . .


효과:


'원본 이미지 보기'를 클릭하면 원본 이미지가 새 브라우저 창(탭)에 표시됩니다.

작가:

엘프 순대(리틀 헷갈림)

관련 라벨：
wordpress
원천：php.cn
이전 기사：JQuery_jquery에서 getJSON을 사용하는 방법 다음 기사：JavaScript 학습 여정 및 경험 공유_기본 지식
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
wp-cli에 WordPress 버전 고정 WordPress를 다운로드하기 위해 wp-cli를 사용하고 있습니다wp-cli--allow-rootcoredownload WordPress 버전을 수정할 수 있...
에서 2024-04-04 21:52:26
0
1
1456
그림자 복제 버전으로 메뉴 버튼을 x 모양으로 변환하는 호버 효과 만들기 먼저 제 제목이 혼란스럽다는 점을 인정하고 죄송합니다. 내가 달성하고 싶은 것은 hover에 대한 다음과 같은 효과입니다. 내 웹 사이트는 여기 https://w...
에서 2024-04-04 11:55:21
0
2
315
부분적인 파일 이름 일치를 기반으로 지정된 경로에서 파일 가져오기 저는 gulp를 사용하여 애플리케이션(scss, js) 파일의 프런트엔드를 구축하는 WordPress를 개발 중입니다. 내 function.php에서는 enque...
에서 2024-04-03 14:50:46
0
1
419
Jquery 슬라이더가 올바르게 표시되지 않는 이유는 무엇입니까? 고급 사용자 정의 필드 플러그인에서 가져온 이미지 슬라이더를 표시하기 위해 WordPress 사용자 정의 테마에 SlickSlider 라이브러리를 구현하려고 합니...
에서 2024-04-03 10:43:26
0
1
397
사용자 정의 PHP 페이지에 배치할 WordPress 사진' 값을 검색합니다. 기존 HTML(특히 asp.net 웹사이트)에서 WordPress 웹사이트를 만들어야 하므로 다음을 사용하여 템플릿을 만들고 PHP 페이지를 대상으로 지정합니다....
에서 2024-04-02 19:13:12
0
1
296
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿