我如何用jquery覆蓋這個css行爲？

我有以下的html：我如何用jquery覆蓋這個css行爲？

<div class="card"> 
<span class="cardDropdown"> 
    <img class="cardDownArrow" src="/Icons/arrow_down_white.png"/> 
</span> 
</div>

下面CSS所以一般IMG是隱藏的，除非你在徘徊外卡

.card:hover .cardDropdown 
{ 
    visibility: visible; 
} 

.card .cardDropdown 
{ 
    visibility: hidden; 
}

有在Ajax調用在哪裏某種情況即使我沒有在卡上懸停，也想顯示這張圖片。我怎麼能這個組特定的jQuery代碼中只是覆蓋此

visibility: hidden;

設置，並將它我的Ajax調用結束後恢復正常？

來源

2014-04-01 leora

只是直接訪問'.cardDropdown'並將其'visibility'設置爲'visible' –

您可以使用jquery的add.class和remove.class。檢查此鏈接http://api.jquery.com/addclass/ –

添加新的規則，以你的CSS將覆蓋其他人，因爲它的後面和具有適當的特異性：

/* default value is hidden */ 
.card .cardDropdown 
{ 
    visibility: hidden; 
} 

/* show on hover */ 
.card:hover .cardDropdown 
{ 
    visibility: visible; 
} 

/* always show the card if .cardShow class is present */ 
.card.cardShow .cardDropDown { 
    visibility: visible; 
}

而且，然後添加.cardShow類到你的卡對象時，你想要的可視性堅持，然後刪除類時，你想讓它回到動態行爲：

// make visiblity persist regardless of hover state 
$(theCard).addClass("cardShow");

和

// restore dynamic behavior based on hover 
$(theCard).removeClass("cardShow");

來源

2014-04-01 00:05:31 jfriend00

只是不要過分複雜化，增加或需要時取出cardDropdown類：

$('.card > span').addClass('cardDropdown');  // show 
$('.card > span').removeClass('cardDropdown'); // hide

...如果你有cardDropdown類定義沒有其他的款式，否則只是使用不同的類名。

來源

2014-04-01 00:04:16 VisioN

您可以設置cardImage.style.visibility = 'visible';（假設cardImage是對所討論的DOM元素的引用）。這將覆蓋樣式表中的CSS設置。

然後設置cardImage.style.visibility = '';讓樣式表再次得到保留。

來源

2014-04-01 00:05:01

我如何用jquery覆蓋這個css行爲？

回答

相關問題