揭示隱藏div的一部分

我有2個圖像。一個將是另一個將放大版本的背景。只應放大放大的一部分 - 與揭示div相交的部分。所以基本上我想在下面的代碼中實現圓形（揭示）div的內容是紅色的。如果這樣做是不可能的，那怎麼可能？揭示隱藏div的一部分

<style type="text/css"> 
.base, .hidden{ 
    width:500px; height: 500px; 
    position: absolute; top: 0; left: 0; 
} 
.base { background: #800; } 
.hidden { background: #080; } 
.reveal { 
    width: 200px; height: 200px; border-radius: 100px; 
    border: 5px solid #000; 
    position: absolute; top: 0; left: 0; 
} 
</style> 
<div class="base"> 
    <div class="hidden"></div> 
    <div class="reveal"></div> 
</div>

來源

2014-03-07 Ultimate Gobblement

這樣嗎？ http://jsfiddle.net/p4Zs2/1/ –

不完全是，它需要顯示圈內隱藏div的內容;不只是將紅色圈起來。 –

我設法用夾子路，實現什麼，我到底想：

<style type="text/css"> 
    .a, .b {width: 500px; height: 500px; position: absolute; top: 0; left: 0} 
    .a{ background: red } 
    .b{ background: green; -webkit-clip-path: circle(100px, 100px, 50px); } 
</style> 
<div class="a"></div> 
<div class="b"></div>

來源

2014-03-12 15:53:40

揭示隱藏div的一部分

回答

相關問題