表单 'submit button' 不会滑动
Form 'submit button' won't SLIDE
你能告诉我为什么幻灯片功能不起作用吗?
https://jsfiddle.net/lcoulon/51gn2v45/
即使我调用了 CSS 和 jquery,它也不会滑入真正的 HTML 页面:
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet">
<link href="../css/slide-submit.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
我的最终目标是将这个提交按钮集成到一个 Bootstrap4 网页模板中。
非常感谢您的帮助,
首先,在 JSfiddle 示例中,问题出在链接上。
在这里(经过几次尝试)working example
其次,或者您的网站似乎忘记添加滑块处理代码。
如您所说,控制台没有错误,所以我只是尝试直接添加代码
(只有上面这部分,看看会不会有什么变化)
/*!
* Slide to submit button
*/
$(".slide-submit button").draggable({cancel: false, containment: "parent", axis: "x", stop: function() {
if (($(this).parent().width() / 2) === ($(this).position().left + 8)) {
$(this).css({left: "auto", right: 0}).addClass("submitted").text("Submitting...").draggable('false');
$(this).closest("form").submit();
} else {
$(this).css({left: 0});
}
}}).on("click", function() {
return false;
});
看起来成功了 (recorded animation here)
你能告诉我为什么幻灯片功能不起作用吗?
https://jsfiddle.net/lcoulon/51gn2v45/
即使我调用了 CSS 和 jquery,它也不会滑入真正的 HTML 页面:
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet">
<link href="../css/slide-submit.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
我的最终目标是将这个提交按钮集成到一个 Bootstrap4 网页模板中。
非常感谢您的帮助,
首先,在 JSfiddle 示例中,问题出在链接上。 在这里(经过几次尝试)working example
其次,或者您的网站似乎忘记添加滑块处理代码。
如您所说,控制台没有错误,所以我只是尝试直接添加代码
(只有上面这部分,看看会不会有什么变化)
/*!
* Slide to submit button
*/
$(".slide-submit button").draggable({cancel: false, containment: "parent", axis: "x", stop: function() {
if (($(this).parent().width() / 2) === ($(this).position().left + 8)) {
$(this).css({left: "auto", right: 0}).addClass("submitted").text("Submitting...").draggable('false');
$(this).closest("form").submit();
} else {
$(this).css({left: 0});
}
}}).on("click", function() {
return false;
});
看起来成功了 (recorded animation here)