您的位置：首页 > Web前端 > JQuery

jquery 隐藏和显示效果

2014-01-13 12:53 453 查看
项目今天完成了，我觉得自己的代码能力还差很多，

给自己定下的目标：1，加强算法训练（自己解决问题的能力有限）

                                  2.加强对前台的练习

下面是我今天总结的jquery  的一些特别有用的属性

1.隐藏和显示

$("#hide").click(function(){
$("p").hide();
});

$("#show").click(function(){
$("p").show();
});
hide();括号里面可以加数值，毫秒为单位

$("button").click(function(){
$("p").toggle();
});   切换hide（） 和show() 方法
$(selector).toggle(speed,callback);可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。

默认加一个   toggleClass
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("h1,h2,p").toggleClass("blue");
  });
});
</script>
<style type="text/css">
.blue
{
color:blue;
}
</style>
</head>
<body>

<h1>标题 1</h1>
<h2>标题 2</h2>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
<button>切换 CSS 类</button>
</body>
</html>

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                jquery show hide
                                                css切换
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航