教程集 www.jiaochengji.com
教程集 >  jQuery  >  jquery 教程  >  正文 jQuery淡入淡出效果代码

jQuery淡入淡出效果代码

发布时间:2015-12-20   编辑:jiaochengji.com
本文介绍了jquery淡入淡出效果的一例代码,有关jquery 淡入淡出的实现方法,有需要的朋友参考下。

例子,jquery 淡入淡出效果。
 

复制代码 代码示例:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
  <script src="http://code.jquery.com/jquery-latest.js"></script> 
  <script>
  //jquery 淡入淡出效果
  $(document).ready(function(){ 
    $("button").click(function () { 
      if($(this).html() == "Hide"){ 
        $(this).html("Show"); 
        $("p").show(600); 
      } else { 
        $(this).html("Hide"); 
        $("p").hide(600); 
      } 
    });     
  }); 
  </script> 
  <style> 
  p { background:#dad; font-weight:bold; } 
  </style> 
</head> 
<body> 
  <button align="right">Hide</button> 
  <p style="display: none;">Hiya</p> 
  <p style="display: none;">Such interesting text, eh?</p> 
</body> 
</html> 

您可能感兴趣的文章:
jQuery淡入淡出效果代码
jquery (show,fadeOut,Animate)简单效果
jQuery 淡入淡出、展开收缩菜单实现代码
jQuery淡入淡出效果 InnerFade
jquery 淡入淡出效果的简单实现
jQuery图片预览插件 Jquery Fade In.Fade Out
C# 窗体淡入淡出效果的实现方法与代码
基于jquery实现的文字淡入淡出效果
js 淡出淡入效果代码
jQuery 淡入淡出 png图在ie8下有黑色边框的解决方法

关键词: jquery实例  jquery特效  淡入淡出   
[关闭]
~ ~