2010-01-06 3 views
1

이 작업을 수행하는 가장 좋은 방법은 무엇입니까? 기본적으로 웹 사이트에 이미지 광고의 포토샵 식 컬러 오버레이를 적용하고 싶습니다. 가급적 CSS를 통해,하지만 자바 스크립트도 작동합니다. 내 첫 번째 아이디어는 광고 div와 동일한 너비와 높이로 의도 한 색상으로 div를 배치하고 불투명도 설정을 적용하여 함께 혼합되도록했습니다. 생각?웹 사이트 주제와 일치하도록 이미지 광고 재사용

+0

없음 솔루션을 내게 ... 끔찍한 모양 간단한 알파 혼합 사용. 이미지 대비가 많이 떨어지며 테마와 다른 색상을 유지합니다. 모든 픽셀에 "StainedGlass"필터를 적용 할 수 있습니다 (기본적으로 이미지의 모든 색상에 테마 색상을 곱함). 대비를 유지하지만 이미지는 어두워집니다. 더 좋은 방법은 풀 컬러 범위를 검은 색 테마 흰색 그라데이션으로 매핑하는 것입니다. –

답변

1

우선, 귀하의 광고주가 광고의 색 구성표를 변경하면 행복하다고 생각하지 않지만 (브랜드 색 등에 대해 생각해보십시오.

배경색과 불투명도가있는 오버레이를 사용하면 가장 만족스러운 결과를 얻지 못할 수도 있지만 달성하려는 단계로 나아가는 단계입니다. 유일한 문제는 오버레이가 링크를 끊을 수 없게 만들 것이므로 광고의 이미지가 맨 아래에 있고 오버레이가 실제로 링크가되도록해야합니다. 예를 들어,이 작동하지 않을 수 있습니다

<div class="ad-container"> 
    <img src="ad_image.jpg" /> 
    <a href="www.ad.com">Real ad link</a> 
</div> 

그리고 CSS에서을 :

.ad-container { 
    position: relative; 
} 

.ad-container a { 
    display: block; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background-color: #f00; 
    opacity: 0.5; 
    filter: alpha(opacity=50); /* for IE */ 
    text-indent: -9999px; /* Hide text */ 
} 
2

우리가 말하는 Google 애드 센스라면, 당신이 할 수 없다고 확신합니다. Google AdSense policies 페이지를 읽으십시오.

그런데 유일한 합리적인 해결책은 블렌딩을 사용하는 것이지만 결과는 끔찍하고 Obscured by elements on a page 정책 규칙을 직접 위반하는 것입니다.

관련 문제