我正在使用 jquery-ui 1.11。我有一个按钮,我希望它的事件状态显示该按钮在单击时按下。使用我从 jquery-ui 网站复制的默认功能,文本颜色从蓝色变为珊瑚色。我在按钮上添加了一个阴影,我希望事件状态能够移除框阴影,这样它看起来就像按钮在被点击时按下一样。 这是我的 HTML:
<div id="rotation_btn_div">
<input id="rotation_schedule_btn" type="button" value="Create Schedule" />
</div>
这是我的 jquery 函数:
$(function () {
$("#rotation_schedule_btn")
.button()
.click(function (event) {
event.preventDefault();
});
});
删除 .button()
会删除单击按钮时的更改(即将文本从蓝色更改为珊瑚色)。我想保持文本不变,只是在单击时将按钮显示为按下状态。
这是我的 .css:
input[type="submit"],
input[type="button"],
button {
background-color: #d3dce0;
border: 1px solid #787878;
cursor: pointer;
font-size: medium;
font-weight: 600;
padding: 7px;
margin-right: 8px;
width: auto;
box-shadow: 5px 5px 5px #888888;
}
button:active {
box-shadow: none;
}
最佳答案
您想在按钮类型的输入标签上应用 CSS,这样您就可以那样使用 CSS 选择器:
使用
input[type="button"]:active {
box-shadow: none;
}
代替
button:active {
box-shadow: none;
}
编辑:您可以为按钮添加边距,使其看起来更像按下按钮。您可以根据框阴影值调整边距以获得所需的效果。
input[type="button"]:active {
box-shadow: none;
margin-top:3px;
margin-left:3px;
}
关于jquery - 更改 jquery-ui 按钮的事件状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33083826/