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
似乎对我很好用 –