Home > Web Front-end > JS Tutorial > How to implement flipping fadeIn display using jquery

How to implement flipping fadeIn display using jquery

巴扎黑
Release: 2017-06-30 10:15:24
Original
1240 people have browsed it

This article mainly introduces the method of jquery to realize the flipping of fadeIn display. The example analyzes the usage skills of the fadeIn method in jQuery. Friends who need it can refer to the following

The example of this article explains jquery implements the method of flipping fadeIn display. Share it with everyone for your reference. The specific implementation method is as follows:


$(function() {
  //翻动显示
  $("#zuixin p:not(:first)").css("display","none");
  var B=$("#zuixin p:last");
  var C=$("#zuixin p:first");
  setInterval(function(){
    if(B.is(":visible")){
      C.fadeIn(500).addClass("in");B.hide()
    }else{
      $("#zuixin p:visible").addClass("in");
      $("#zuixin p.in").next().fadeIn(500);
      $("p.in").hide().removeClass("in");
    }
  },3000); //每3秒钟切换一条,你可以根据需要更改
});
Copy after login

The above is the detailed content of How to implement flipping fadeIn display using jquery. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template