javascript - H5 기술을 사용하여 WeChat Alipay 결제 바코드와 유사한 전체 화면 및 가로 모드로 자동 전환을 구현하시겠습니까?

Question

제목 그대로에요. H5+를 사용하여 앱을 개발했습니다. QR 코드를 클릭하면 화면이 확대되고 가로로 표시되는 효과를 더 잘 구현하는 방법은 Alipay 및 WeChat 결제 인터페이스와 유사합니다.

그림 3의 효과. 나는 그것을 잘하지 못했습니다. 여러분 모두에게 우아한 구현 방법을 제공해 주시기를 바랍니다.

Answer 1

CSS3의 변환에서 2D 변환 회전(각도) 속성을 사용하면 될 것 같아요! 클릭하면 회전하게 해주세요

Answer 2

아이디어: 가로,세로 화면 감지 => tansform rotate & 改变font-size
더 자세한 가로,세로 화면 실습, 모바일 측 강제 가로 화면 및 강제 세로 화면 솔루션 제공

Answer 3

이것을 검색해 보세요onorientationchange, 호환성 문제가 있을 수 있고, 코드 구현을 한두 문장으로 설명할 수 없으며, 원하는 효과가 아닐 수도 있습니다.