如何能夠讓圖像

Question

白線影響我怎樣才能讓這個effect 使用此image

我不得不使用上有許多圖像這樣的效果，所以我不能使用增白效果的圖像。

它有可能嗎？

Answer 1

您可以在之後或之後嘗試僞元素來做到這一點。

[Demo]

.pillar:after, .pillar:before { 
    position: absolute; 
    content: ''; 
    height: 350px; 
    width: 64px; 
    top: 16px; 
    left: 70px; 
    background-image: url(http://www.indonesia.travel/public/media/images/upload/poi/Danau%20Segara%20Anak%20-%20Gallery.jpg); 
} 

Answer 2

它在很多方面基本上是可能的。

我認爲最簡單的方法是用所有白線創建一個「蒙版」，並使用透明背景。 然後，只需將你的面具放在你的圖像上，瞧。

編輯

這裏是你的面具：Click !

EDIT 2

如果你想保護你對副本的形象，也許這是最好不要上傳，只是表示變形img online =）

Answer 3

是的，這是可能的
在這裏你可以下載插件：http://almogbaku.github.io/imageMask/

1. 創建圖像元素

   <img src="image.jpg" class="mySelector" />

2. 創建蒙版圖像（黑色將保持停留，並且透明將被切割） 蒙版

3. 將imageMask查詢添加到就緒事件中。使用功能.imageMask（path_to_mask）

   $(document).ready(function() { $(".mySelector").imageMask("mask.png"); });

4. 你可以添加一些回調處理

   $(document).ready(function() { $(".mySelector").imageMask("mask.png", function($canvas) { console.log('Do something here!', $canvas); }); });

5. DONE！