我有一个onclick函数,可删除HTML div上的display:none样式。
function myFunctionUnder18() {
document.getElementById("myAgeMessage").style.display = "block";
}
<input type="radio" name="age" onclick="myFunctionUnder18()" >
<div style="display: none;" id="myAgeMessage"><p>Sorry. You need to be at least 18 years of age.</p></div>
有没有一种方法可以添加jQuery效果以使消息平滑显示?
答案 0 :(得分:1)
您可以将 持续时间 (以毫秒为单位)传递给.show()
。
持续时间 在哪里
一个字符串或数字,确定动画将运行多长时间。
function myFunctionUnder18() {
$("#myAgeMessage").show(1000);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" name="age" onclick="myFunctionUnder18()" >
<div style="display: none;" id="myAgeMessage"><p>Sorry. You need to be at least 18 years of age.</p></div>
您也可以使用fadeIn()
:
function myFunctionUnder18() {
$("#myAgeMessage").fadeIn(1000);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" name="age" onclick="myFunctionUnder18()" >
<div style="display: none;" id="myAgeMessage"><p>Sorry. You need to be at least 18 years of age.</p></div>