更改html點擊事件以顯示內部html c＃

Question

任何人都可以告訴我如何在顯示內部html時點擊本網站中的圖標之一？又名資產。

Example

Answer 1

注：內部HTML是HTML標籤的內容 例如：

你好

=>你好是內部HTML

，但根據您的例子中，你正在尋找如何添加/刪除UI元素到/從屏幕。

您可以使用C＃爲它，但這是最佳的選擇。由於服務器不必要的負載和客戶端的不良UX-UI。

最好的選擇是使用基於CSS和CSS的動畫來製作它。檢查這個動畫。 animationcss 解決方案的關鍵是尋找css懸停，如果你正在尋找與示例相同的行爲或使用js點擊添加css類到你的元素。

$("#clickItem").click(() => { 
 
    $(".hiddenContent2").toggleClass("showThis"); 
 
});

.hiddenContent1 , .hiddenContent2{ 
 
    visibility: hidden; 
 
} 
 

 
.item{ 
 
    cursor:pointer; 
 
    border:1px solid red; 
 
    margin:5px; 
 
    padding:10px; 
 
    width:200px; 
 
} 
 

 
#hoverItem:hover .hiddenContent1 { 
 
    visibility: visible; 
 
} 
 

 
.showThis{ 
 
    visibility:visible; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://raw.github.com/daneden/animate.css/master/animate.css" rel="stylesheet" /> 
 

 
<div id="hoverItem" class="item"> 
 
    <h4>item hover</h4> 
 
    <div class="hiddenContent1"> 
 
    <p>hidden elements</p> 
 
    </div> 
 
</div> 
 
<div id="clickItem" class="item"> 
 
    <h4>item click</h4> 
 
    <div class="hiddenContent2"> 
 
    <p>hidden elements</p> 
 
    </div> 
 
</div>