Bir html sayfasında görüntüyü filigran/bindirme nasıl yapılır?

Question

Bir şekilde yarı saydam görüntüye sahip bir html sayfasının filigranı arkasındaki sayfadaki kullanıcı etkileşimi aracılığıyla hala izin vermek mümkün mü? Çelişkili ve karmaşık bir betik olmadan mümkün görünmüyor, ama belki bir şeyleri özlüyorum.

Answer 1

Bu en modern tarayıcılar için çalışır: Eğer gerekirse bir javascript yedek özelliğini like this one kullanmak gerekir böylece

div#watermark { 
    position: fixed; 
    width: 100%; 
    height: 100%; 
    z-index: 99999; 
    background: url('path/to/image.png') center center no-repeat; 
    pointer-events: none; 
} 

Maalesef IE, pointer-events özelliğini tanımıyor. Ayrıca, bazı eski mobil tarayıcılar/eski IE position: fixed'u desteklemez, böylece görüntüyü görünümün ortasına yerleştirmek için başka bir javascript geri dönüşü gerekir.

Answer 2

bu deneyin:

#watermark { 
    background-image: url('watermark.png'); 
    repeat: no-repeat; 
    opacity: 50; 
    position: relative; 
    bottom: 0; 
    float: left; 
}