그누보드 나리야빌더 NB-Basic 보드스킨 GIF 움짤 표현 최적화하기

그누보드 5.4.2.8 버전부터 움직이는 GIF 이미지를 올리면 MP4나 WEBM으로 변환하여 보여줄 수 있습니다.

https://sir.kr/g5_plugin/7521

위 플러그인으로 가능합니다.

여기에 CSS만 추가로 작업해주면 표현해주는데 완벽할 것입니다.

현재로서는 GIF 움짤 원본 이미지 사이즈에 맞게 표시가 되므로, 가로가 큰 움짤의 경우 모바일에서 보면 짤립니다.

/skin/board/NB-Basic/style.css

그래서 위 파일의 24번째 줄 근처에

#bo_v_con video{
	max-width:100%;height:auto
}
video[poster]{
	object-fit:fill
}

위 내용을 추가해주면, 가로폭이 줄어드는만큼 움짤도 줄여서 보여줄 것입니다.

적용 전

오른쪽이 짤려서 오토바이가 안보입니다.

---

적용 후

가로 크기가 조정되어 오토바이가 잘 보입니다.