如何在圖像上懸停時變暗背景

-1

我創建了jQuery懸停按鈕。當您將鼠標懸停在框上時，會出現一個jQuery按鈕。但是，它不起作用。有人可以向我展示如何在盤旋時向盒子添加黑色背景？如何在圖像上懸停時變暗背景

目標是：

當在框滾動，則顯示「圖表它BTN」
當通過盒滾動時，盒得到一個黑色背景。

/* CHART IT BTN ON POTS 
===================================================================*/ 
$(".btn-trigger").hover(function() { 
    $(this).find(".charthis-btn").show(); 
}, function() { 
    $(this).find(".charthis-btn").hide(); 
})

我需要被示出當滾過變暗黑色具有50％的不透明度圖像。

來源

2013-10-29 Paul Designer

爲什麼投票下來沒有解釋？ – AfromanJ

感謝您的支持 –

@PaulDesigner您是否在尋找使按鈕保持不變並且按鈕背景爲黑色？或者按鈕棒和黑色的背景？ – usernolongerregistered

我不知道這是否是你想要什麼，但試試這個：

編輯

DEMO

$(".display-box").hover(function() { 
    $(this).find(".charthis-btn").show(); 
    $(this).find(".hover-mask").fadeIn(); 
}, function() { 
    $(this).find(".charthis-btn").hide(); 
    $(this).find(".hover-mask").fadeOut(); 
})

來源

2013-10-29 12:07:05 enyce12

我已經更新了我的小提琴，所以我可以更清楚地解釋目標。我需要顯示的圖像變黑時使用不透明度爲50％的黑色。我期待你的回覆。 jsfiddle.net/7pw8E/7 –

我已經更新了我的答案。請檢查新的jsfiddle。 – enyce12

謝謝！這很好 –

的FIDDLE

JS：

$(".display-box").hover(function() { 
$(this).find(".charthis-btn").show(); 
}, function() { 
$(this).find(".charthis-btn").hide(); 
})

來源

2013-10-29 12:06:02

嗨，謝謝你的幫助。我已經更新了我的小提琴，所以我可以更清楚地解釋目標。我需要顯示的圖像變黑時使用不透明度爲50％的黑色。我期待你的回覆。 http://jsfiddle.net/7pw8E/7/ –

$(".display-box").hover(function() { 
$(this).find(".charthis-btn").show(); 
}, function() { 
$(this).find(".charthis-btn").hide(); 
}) 
$(".charthis-btn").on('mouseenter',function(){ 
$(".display-box img").css('opacity','0.5'); 
}) 
$(".charthis-btn").on('mouseout',function(){ 
$(".display-box img").css('opacity',''); 
})

來源

2013-10-29 12:13:06

嗨，謝謝你的幫助。我已經更新了我的小提琴，所以我可以更清楚地解釋目標。我需要顯示的圖像變黑時使用不透明度爲50％的黑色。我期待你的回覆。 jsfiddle.net/7pw8E/7 –

我已根據您的要求更新代碼 - 乾杯！ –

如何在圖像上懸停時變暗背景

回答

相關問題