gpt4 book ai didi

JQuery点击方法不起作用

转载 作者:太空宇宙 更新时间:2023-11-04 09:50:49 26 4
gpt4 key购买 nike

我正在尝试在中心按下一个按钮,使 div 中的所有元素向上滑动。

$(document).ready(function() {
$("#imgs").click(function() {
$("#start").animate({
bottom: "+=250px"
}, "slow");
});
});
#imgs {
display: block;
margin: 0 auto;
opacity: 1.0;
filter: alpha(opacity=100);
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
bottom: 0px;
}
#imgs:hover {
opacity: 1;
filter: alpha(opacity=100);
transform: scale(1.2);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
}
html {
width: 100%;
height: 100%;
clip: auto;
position: absolute;
overflow-x: hidden;
overflow-y: hidden;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<body style="margin:0;">

<div id="start" style="bottom:0px">
<img src="saint die.jpg" style=" z-index:-20; width:150%; position:absolute">
<div align="center" style="bottom:69%; position:absolute; width:45%; left:28%; ;">
<img src="DELICETEXT.png" alt="delice" style="width:100%">
</div>
<div id="imgs" align="center" style="position:absolute; width:25%; height: 25%; left:38%; top:30%;">
<img src="delice.png" alt="L'arbre a Delices" style="width:100%; position: relative;">
</div>
</div>
</body>

当我将鼠标悬停在按钮/图像上时,它会按预期放大。但是,当我单击它时没有任何反应。我在控制台中没有看到任何错误,并且在 Google 上搜索也没有任何结果。

我该如何解决这个问题?

最佳答案

如果要为 toprightbottom 设置动画,则必须为元素指定一个位置以允许 animate 移动它,或 left 属性:

<div id="start" style="bottom:0px; position:relative;">

根据 .animate() documentation :

Directional properties (top, right, bottom, left) have no discernible effect on elements if their position style property is static, which it is by default.

关于JQuery点击方法不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39110785/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com