当我单击div时，我试图在jquery中从右效果向左滑动。这是我正在使用的HTML。
<div id="myDiv" style="height: 70px; display: none; background-color:#eee; position: absolute; bottom: 1px; width: 100%">
<img style="margin-left: 9px; top: 8px; position: absolute" id="transparent-image" src="images/hover.png" alt="">
<p class="bi" style="display: inline; color: black; margin-left: 7%; position: absolute">Webbing in an alternative social network. based on intrests and interactions between people all over the world.</p>
这就是我要使用的jQuery。
$(function()
{
$("#toggle").click(function () {
$(".sliding").css("display","none");
//$(".sliding").animate({left:'-240px'});
// Set the effect type
var effect = 'slide';
// Set the options for the effect type chosen
var options = { direction: 'left' };
// Set the duration (default: 400 milliseconds)
var duration = 10000;
$('#myDiv').toggle(effect, options, duration);
});
我已经实现的是div显示的是onclick，但它并没有从左滑到右。请帮帮我。我感谢您的帮助。谢谢。
我也添加了jsfiddle链接。http://jsfiddle.net/yLyr599z/
我认为这是您想要的：
$(function() {
$("#toggle").click(function () {
$("#myDiv").animate({right:'0'});
});
});#toggle{
position: absolute;
left: 10px;
bottom: 10px;
cursor: pointer;
}
#myDiv {
height: 70px;
background-color:#eee;
position: absolute;
bottom:0;
right: 100%;
width: 100%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="toggle">
Text to click. This will be an image though.
</div>
<div id="myDiv">
This text should slide out from left to right and overlap the onclick text.
</div>一些关键的事情：
right: 100%对定位的元素执行此操作。right: 0因为您的宽度为100％。那就是您传递给jQuery中的animate方法的值。本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句