0
我想建立一個基本的標籤導航。當我在選項卡(步驟)上懸停時,選項卡的背景變爲綠色。 但經過幾次懸停/調整瀏覽器大小,懸停不再起作用。然後,我必須點擊該標籤才能獲得綠色背景。它有點凍結。jquery - 懸停改變後點擊幾次調整
多數民衆贊成在的jsfiddle: https://jsfiddle.net/rob_the_mob_87/L84kyym1/
這裏是我最小的代碼:
的index.html
<html>
<head>
<title>Tabs</title>
<script
src="https://code.jquery.com/jquery-3.2.1.js"
integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE="
crossorigin="anonymous"></script>
<script type="text/javascript" src="js/static.js">
</script>
<link rel="stylesheet" type="text/css" href="./css/main.css">
</head>
<body>
<div class="process_step active" id="1">Step 1</div>
<div class="process_step" id="2">Step 2</div>
</body>
</html>
的main.css
.process_step{
}
.active{
background-color: green;
}
static.js
$(document).ready(function() {
bindShowStepHandlers()
});
this.bindShowStepHandlers = function() {
$('.process_step').each(function() {
$(this).hover(function() {
var clickedStepId = $(this).attr('id');
openStep(clickedStepId);
});
});
}
this.openStep = function (clickedStepId) {
$('.process_step').each(function() {
var stepId = $(this).attr('id');
if (stepId == clickedStepId) {
$(this).addClass('active');
} else {
$(this).removeClass('active');
}
});
}
請創建片段或jsfiiddle演示。那麼我可以幫你 –
代碼中沒有任何東西可以創建問題,但是你可以改進代碼爲https://jsfiddle.net/L84kyym1/1/ – Satpal
似乎對我很好用 –