홈페이지, 쇼핑몰 제작 및 유지보수 업체

피클웹 아이디가 있으신가요? Login


카카오톡 채널 QR코드

카페24 쇼핑몰 제작, 유튜브 공유 퍼가기

게시일: 2020-10-10, 업데이트: 2023-02-15


840 2023-02-152020-10-10

상품상세정보, 게시판에 유튜브 반응형으로 삽입

상품 상세 정보와 게시판 글보기 내용에 삽입되는 유튜브 영상의 경우 스마트폰 (모바일) 화면의 가로 사이즈에 맞게 자동 조정되어야 합니다.
아래 자바스크립트 코드를 해당 페이지에 적용되는 .js 파일에 삽입합니다.

상품 상세 페이지

$(document).ready(function() {
    var youtube_area_w = $('.xans-product-additional #prdDetail').width();
    var w = $('.xans-product-additional #prdDetail iframe').attr('width');
    var h = $('.xans-product-additional #prdDetail iframe').attr('height');
    var w_h_rate = w / h;
    $('.xans-product-additional #prdDetail iframe').css({'width':youtube_area_w,'height':youtube_area_w / w_h_rate})
});

게시판 글보기 페이지

$(document).ready(function(){
    var youtube_area_w = $('.boardView .content').width();
    var w = $('.boardView .content iframe').attr('width');
    var h = $('.boardView .content iframe').attr('height');
    var w_h_rate = w / h;
    $('.boardView .content iframe').css({'width':youtube_area_w,'height':youtube_area_w / w_h_rate})
});

웹 호스팅, 웹 서버 관리 방법

전문적인 호스팅 업체를 이용할 경우 데이터와 DB의 백업이 매일 새벽..

키보드 매니아 KBDMania

키보드 매니아 KBDMania 뜨겁게 불타올라라, 손가락들이여! 세계..

팝스메일 설정, 모질라 썬더버드

팝스메일은 Daum 커뮤니케이션, 하나은행, 주부닷컴, 메디다스 등 ..

카카오톡 채널 채팅하기