StackExchange 사이트에서 코드를 전체 화면으로 확장

마우스를 올리면 코드 블록을 전체 화면으로 전환

이 스크립트 설치 ?

질문 또는 리뷰 남기기, 또는 스크립트 신고하기.

작성자

138 Aspen

일일 설치 수

총 설치 수

평점

0 0 0

버전

0.1.4

생성일

2024-02-15

갱신일

2025-09-18

크기

17.3KB

라이선스

MIT

적용 사이트

StackExchange 코드 풀스크린 뷰어

코드 블록에 전체 화면 및 복사 기능을 추가함으로써 StackExchange 사이트에서 코드 보기 경험을 향상시키는 포함적인 사용자 스크립트.

## 특징

🔍 전체 화면 코드 보기

분산 없는 보기 위해 전용 새로운 - - 코드 블록을 열
향상된 색상 계획으로 원래의 구문 강조를 보존
풀 스크린 부동산을 활용하는 반응형 디자인
코드 읽기 위해 최적화된 깨끗하고 최소한의 인터페이스

📋 원클릭 코드 복사

한 번의 클릭으로 클립보드에 코드 블록을 복사하십시오.
시각적 피드백은 성공적인 복사 작업을 확인합니다
원래 페이지와 전체 화면 보기와 원활하게 작동

🎨 구문 하이라이팅

원래 StackExchange 구문 강조를 유지합니다
Highlight.js를 사용하여 풀스크린 모드에서 강조 표시를 향상
자동 언어 감지 및 보존
최적의 읽기 가능성을 위한 GitHub 스타일 색상

⌨️ 키보드 단축키

탈출: 풀스크린 - **
효율적인 탐색을 위한 직관적인 제어

## 설치

사용자 스크립트 관리자 (Tampermonkey, Greasemonkey 등) 설치
사용자 스크립트에서 이 스크립트를 설치
코드 블록이 있는 StackExchange 사이트를 방문하십시오.
새로운 버튼을 보기 위해 코드 블록 위에 마우저

## 사용법

### 기본 작업

** 제어 버튼을 드러내기 위해 어떤 코드 블록 위에 hover**
**새로운 전용 탭에서 코드를 열기 위해 "풀스크린"을 클릭하십시오.
** "복사"를 클릭하여 클립보드로 코드를 복사하십시오.
프레스 Escape를 클릭하여 풀스크린 4 4 닫기

### 전체 화면 보기 기능

도구막대: 복사와 닫기 버튼으로 고정 위치
문법 하이라이팅: 감지된 언어에 따라 자동으로 적용
Responsive Layout: 코드는 사용할 수 있는 화면 공간을 채우습니다.
키보드 탐색: 빠른 출구를 위한 탈출 키 지원

## 지원되는 사이트

스크립트는 전체 StackExchange 네트워크에서 작동합니다:

### 주요 사이트

스택 오버플로우 - 모든 프로그래밍 질문과 코드 예제
Super User - 시스템 관리 및 파워 사용자 코드
서버 오류 - 서버 및 네트워크 관리 스크립트
우분투를 물어보십시오 - 우분투/리 - - Linux 명령줄 및 구성
Math Overflow - 수학 코드와 알고리즘

### 추가 보호

모든 StackExchange 하위 사이트 (200+ 커뮤니티)
지원되는 모든 플랫폼에 대한 메타 사이트
리뷰 - **검색 결과
StackApps API 관련 코드 예제

## 기술적 세부사항

### 구현

순수한 자바스크립트 - 메인 페이지에 외부 의존성 없음
CDN 통합 - 하이라이트.js는 전체 화면 - CDN 통합
비침입 - 원래 페이지 스타일링과 기능을 보존
성능 최적화 - 페이지 로드 시간에 최소한의 영향

### 브라우저 호환성

크롬/크롬 - 완전한 지원
Firefox - 완전한 지원
Safari - 전체 지원
Edge - 완전한 지원
모바일 브라우저 - 기본 기능

### 보안

MIT Licensed - 오픈 소스 및 감사 가능
데이터 수집 없음 - 완전히 클라이언트 측 작동
** - ** - ** - ** - ** - ** - ** - ** - ** *** - ** - ** *** - ** *** - ******** - **********
안전한 실행 - 메인 페이지에 외부 스크립트 주입 없음

## 코드 구조

### 주요 구성 요소

 // 핵심 기능
addStyles() // 버튼과 레이아웃에 대한 CSS를 주입합니다.
addButtons() // 코드 블록에 대한 호버 버튼을 만듭니다.
openCodeInNewTab() // 전체 화면 보기 경험을 생성합니다.
copyToClipboard() // 코드 복사기능을 처리합니다.

### CSS 아키텍처

투명 패퍼 - 원래 스타일링을 방해하지 마십시오.
반응형 디자인 - 다른 화면 크기에 적응
호버 상호작용 - 깨끗하고 직관적인 사용자 경험
전체 화면 최적화 - 전용 뷰에서 최대 읽기 가능성

### 이벤트 처리

Load events - 페이지 콘텐츠 로드 후 초기화
호버 상태 - 제어 버튼을 표시 / 숨기기
클릭 처리기 - 전체 화면 및 복사 작업을 관리합니다
키보드 이벤트 - 풀스크린에서 탈출 키 지원

## 사용자 정의

### 스타일링 옵션 스크립트는 CSS 변수를 수정하여 사용자 정의 할 수 있습니다:

CSS /* 버튼 외관 / .버튼 { 배경색: #eee; / 버튼 배경 / 글자 크기: 12px; / 버튼 텍스트 크기 / 패딩: 4px 8px; / 버튼 간격 */ }

/* 풀스크린 스타일 / .toolbar 버튼 { 배경: #007acc; / 도구막대 버튼 색상 / 색깔: 백색; / 도구막대 텍스트 색상 */ }


 ### 언어 지원
구문 강조는 다음과 같은 190 개 이상의 프로그래밍 언어를 지원합니다.
 - **웹**: 자바스크립트, 타이프스크립트, HTML, CSS, SCSS
 - **백엔드**: 파이파론, 자바, C#, PHP, 루비, Go, Rust
 - **시스템**: C, C++, 어 - ** 시스템**: Shell/Bash
 - **데이터**: SQL, JSON, XML, YAML, CSV
 - **기능적**: Haskell, Lisp, Erlang, F#
 - **모바일**: 스위프트, 코틀린, 다트
 - ** 그리고 더 많은...**


 ## 문제 해결

 ### 일반적인 문제

 ** 버튼이 나타나지 않습니다 **
 - 사용자 스크립트 관리자가 활성화되어 있는지 확인하십시오.
 - 사이트가 지원되는 일치 패턴에 있는지 확인
 - 설치 후 페이지를 새로 고침

 ** 풀 스크린에서 포포프업 차단 **
 - StackExchange 도메인에 대한 -  -  -  -  -  - StaStackExchange 도메인에 대한 -  -  -  -  - StaStackExchange 도메인에 대한 -  -  -  -  -  -  -  - StackExchange 도메인에 대한 -  -  -  -  - 
 - 브라우저 -  -  - 브브라우저 - 브브라우저 -  -  - 브라우저 -  - 브로커 설정을 확인
 - 버튼을 직접 클릭하십시오 (호버 전환 중 아닙니다)

 ** 문법 강조 표시가 작동하지 않습니다 **
 - 인터넷 연결 확인 (전체 화면에서 CDN 의존성)
 - 코드 블록이 적절한 언어 클래스를 가지고 있는지 확인
 - 전체 스크린 탭을 새롭게 해보십시오.

 ** 복사가 작동하지 않습니다 **
 - HTTPS 연결 보장 (클립보드 API 요구 사항)
 - 브라우저 클립보드 권한을 확인
Ctrl+C를 - 팔백으로 사용하십시오.

 ### 성능 최적화
 - 스크립트는 페이지 렌더를 차단하는 것을 피하기 위해 비동기적으로 로드됩니다.
 - 최소한의 DOM 수정 원래 기능을 보존
 - 이벤트 대표는 메모리 발자국을 줄입니다
 - 부드러운 상호 작용을 위해 최적화된 CSS 전환




 ## 라이센스

MIT 라이선스 - 개인 및 상업용 무료.

 ## 지원

문제, 기능 요청 또는 기여의 경우:
 - **GitHub 문제**: 버그 보고와 요청 기능
 - **StackExchange 메타**: 커뮤니티와 개선 사항을 논의하십시오.
 - **사용자 스크립트 의견**: 피드백과 팁을 공유

---