用jquery让一个DIV元素向右滑动并快速淡出的语句咋写的?

Posted 2023-05-13

想用jQuery让一个DIV向右快速滑动并弹出请问语句是怎么写的？

$("#DIV").fadeOut("slow");
这个只能做到淡出，但不能移动这个元素啊

1、怎么才能使DIV元素向右滑动？

　     可以使用JQuery中的animate（）函数来实现，jQuery animate() 方法用于创建自定义动画。语法：$(selector).animate(params,speed,callback);必需的 params 参数定义形成动画的 CSS 属性。可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。可选的 callback 参数是动画完成后所执行的函数名称。

2、jquery让一个DIV元素淡出的语句怎么写？

          如上你所写的是正确的不过去快速淡出参数应该是fast

提示：默认地，所有 html 元素都有一个静态位置，且无法移动。如需对位置进行操作，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！即要设置那个移动的DIV的position属性。

jquery让一个DIV元素向右滑动并快速淡出的代码：

<script> 
$(document).ready(function()
  $("button").click(function()
    $("div").animate(left:'250px').fadeOut("fast");
  );
);
</script>

参考资料：http://www.w3school.com.cn/jquery/jquery_animate.asp

希望对你有所了帮助！

参考技术A $(function()
    $("#DIV").animate(left:400,"slow").fadeOut("slow");;
);

参考技术B <script>
$(document).ready(function()
    $("#div").animate(right: '-50px', "slow");
);
</script>

jQuery，您可以实现元素的淡入淡出效果。

• fadeIn()
• fadeOut()
• fadeToggle()
• fadeTo()

jQuery fadeIn() 用于淡入已隐藏的元素

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

jQuery fadeOut() 方法用于淡出可见元素。

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});


fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});


fadeTo() 方法允许渐变为给定的不透明度（值介于 0 与 1 之间）。

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});