[英]jQuery and CSS not working in sharepoint 2013
部署到sharepoint 2013服務器后,我的Web部件jQuery
和CSS
代碼不起作用。
我想問是因為"runat=server"
嗎? 我正在使用它,因為我需要標識html元素並在后端代碼處綁定類常量值。
誰能告訴我我應該如何部署jQuery
和CSS
? 這是我的密碼
jQuery查詢
$(document).ready(function () {
$('.icon').mouseover(function () {
$(".menuLink").stop(true, false).fadeIn(280);
$('.menuLink').stop(true, false).animate({
width: "300px",
opacity: "1",
"padding-left": "10px"
});
});
$('.divTableBody').mouseleave(function () {
$('.menuLink').stop(true, false).animate({
width: "0px",
opacity: "0",
"padding-left": "0px"
});
});
});
的CSS
.divTable {
display: table;
float: right;
height: 200px;
background-color: #0082CA;
}
.divTableBody {
display: table-row-group;
}
.divTableRow {
display: table-row;
}
.menuLink, .icon {
display: table-cell;
padding: 10px 0px;
}
.menuLink {
display: none;
vertical-align: middle;
overflow: hidden;
white-space: nowrap;
padding-left: 10px;
}
.menuLink a {
font-size: large;
text-decoration: none;
color: white;
}
.divTableRow:hover {
background-color: #005C8F;
}
.icon {
width: 30px;
padding-left: 10px;
padding-right: 10px;
position: relative;
}
.icon img {
width: 20px;
height: 20px;
display: block;
margin-left: auto;
margin-right: auto;
}
.userProfile {
height: 30px;
width: 30px;
border-radius: 50%;
display: block;
float: right;
padding-right: 10px;
}
/* Make the badge float in the top right corner of the button */
#badge {
background-color: #fa3e3e;
border-radius: 5px;
color: white;
padding: 1px 3px;
font-size: 10px;
position: absolute; /* Position the badge within the relatively positioned button */
top: 20px;
right: 8px;
}
的HTML
<div class="divTable">
<div class="divTableBody">
<div class="divTableRow">
<div class="menuLink">
<a id="txtLink1" runat="server"></a>
</div>
<div class="icon">
<img id="imgLink1" runat="server" />
</div>
</div>
</div>
</div>
謝謝。
jQuery無法通過在服務器端指定的ID查找元素(通過實現runat="server"
)。 客戶端的ID值已更改 ,其前綴包含有關父元素的信息(在瀏覽器中進行檢查)。
您可以使用ClientIDMode="static"
來防止這種情況並保留ID值
將此屬性應用於所有適用的html。
<div class="divTable">
<div class="divTableBody">
<div class="divTableRow">
<div class="menuLink">
<a id="txtLink1" ClientIDMode="static" runat="server"></a>
</div>
<div class="icon">
<img id="imgLink1" ClientIDMode="static" runat="server" />
</div>
</div>
</div>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.