jQuery 常用代码

作者: 愿你如夏日清凉的风 | 来源:发表于2017-05-02 19:41 被阅读13次

js选项卡切换

 $(this).addClass('active').siblings('li').removeClass('active');
$(document).ready(function(){
    $("#hide").click(function(){
        $("p").hide(1000);
    });
    $("#show").click(function(){
        $("p").show(1000);
    });
    $("#toggle").click(function(){
        $("p").toggle(1000);
    });
})
$(document).ready(function(){
    $("#in").on("click",function(){
        $("#div1").fadeIn(1000);
        $("#div2").fadeIn(1000);
        $("#div3").fadeIn(1000);
    });
    $("#out").on("click",function(){
        $("#div1").fadeOut(1000);
        $("#div2").fadeOut(1000);
        $("#div3").fadeOut(1000);
    });
    $("#toggle").on("click",function(){
        $("#div1").fadeToggle(1000);
        $("#div2").fadeToggle(1000);
        $("#div3").fadeToggle(1000);
    });
   $("#to").on("click",function(){
        $("#div1").fadeTo(1000);
        $("#div2").fadeTo(1000);
        $("#div3").fadeTo(1000);
    });
})
$(document).ready(function(){
    $("div").css("width","100px");
    $("div").css("height","100px");
    $("div").css("background","#ff0000");
    $("div").css({ width:"100px",height:"100px",backgroundColor:"#ff0000"});
    $("div").addClass("style1");
    $("div").click(function(){
        $(this).addClass("style2");
        $(this).removeClass("style1");
        $(this).toggleClass("style2");
    })
});
$(document).ready(function(){
    $("#flipshow").click(function(){
        $("#content").slideDown(1000);
    });
    $("#fliphide").click(function(){
        $("#content").slideUp(500);
    });
    $("#fliptoggle").click(function(){
        $("#content").slideToggle(500);
    })
});

相关文章

网友评论

    本文标题:jQuery 常用代码

    本文链接:https://www.haomeiwen.com/subject/yhlhtxtx.html