2017-05-21 2 views
-1

이미지에 영구적으로 비디오 아이콘을 설정하고 싶지만 그럴 수 없습니다. 내가 할 때, 두 이미지가 표시됩니다 : 1. 비디오 아이콘 2. 내 이미지,하지만 한 번에 하나의 이미지를 조정하지 2.

더 명확하게 : 사진 아이콘과 사진을 공유하고 싶습니다. 비디오 로고가없는 이미지가 있습니다. 코드를 사용하여 이미지에 비디오 로고를 추가하고 싶습니다. 나는 포토샵을 사용하여 로고를 설정하고 싶지 않습니다.이미지에 영구적으로 비디오 아이콘을 설정하는 방법

HTML :

<div class="video"> 
    <img style="height:200px" src="http://i.imgur.com/GMjqTR7.jpg"/> 
    <a href="#"></a> 
</div> 

CSS :

.video { 
    position: relative; 
} 
.video a { 
    position: absolute; 
    display: block; 
    background: url(/images/play-btn.png); 
    height: 100%; 
    width: 100%; 
    top: 75px; 
    left: 150px; 
    background-size: 50px 50px; 
    background-repeat: no-repeat; 
} 

제발 도와주세요. 감사.
JSFiddle - Live

+0

를 참조하십시오. – Rabin

+0

답장을 보내 주셔서 감사합니다 ... 사진 아이콘과 사진을 공유하고 싶습니다. 비디오 로고가없는 이미지가 있습니다. 코드를 사용하여 이미지에 비디오 로고를 추가하고 싶습니다. 나는 포토샵을 사용하여 로고를 설정하고 싶지 않습니다. –

답변

0

이것은 클라이언트 또는 서버 측에서 수행 할 수 있습니다. 귀하의 예제에는 프론트 엔드 코드 만 포함되어 있기 때문에 프론트 엔드에서이 예제를 원한다고 가정합니다.

는 서버 측 예를 들어 watermak JS http://brianium.github.io/watermarkjs/

한 번 봐, 질문을 명확히 해주십시오 대답 Add 'Watermark' to images with php

+0

이미지 비디오 아이콘을 다운로드 한 후 비디오에 세트 아이콘을 지정하려고합니다. –

관련 문제