继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

jquery搞定换皮肤

android零基础入门
关注TA
已关注
手记 288
粉丝 97
获赞 603

<body>

<p>
            <table id="table_1" bgcolor="#8080C0">
               
                <tr>
                    <td><fieldset>
                姓名:<input type="text" name="name" id="name"><p></p>
                电话:<input type="text" name="phone" id="phone"><p></p>
                email:<input type="text" name="mail" id="mail">
               </fieldset> </td>
            <td>
                 <div id="color_1" ></div>
            <div id="color_2" color: rgb(66, 133, 244);" href="file:///C|/Users/Feel~worlD/Desktop/angle/anglebb——2.jpg);width:100px;height:20px">.jpg);width:100px;height:20px"></div>                  //这里放置你的图片
            <div id="color_3" ></div>
            <div id="color_4" ></div>
            </td>
            <td>
           
                <button id="1">金黄色</button><br>     //5个按钮
                <button id="2">人物类</button><br>
                <button id="3">纯黑色</button><br>
                <button id="4">纯绿色</button><br>
                <button id="5">默认色</button><br>
            </td>
            </tr>
            </table></p>

 

<script type="text/javascript" language="javascript">

                      $("#1").click(function(){          //利用jquery的{“#”}获取相应的按钮id
                                
                                $("#table_1").css({         //利用css函数调用背景
                                    
                                    background:"#fFFF00" });   //以下相同
                      
                      }); 

                        $("#2").click(function(){
                               
                                $("#table_1").css({
                                   
                                background:"url(你的图片.jpg)" });
                     
                      });

                         $("#3").click(function(){
                               
                                $("#table_1").css({
                                   
                                    background:"#000000" });
                     
                      });
                     
                     
                       $("#4").click(function(){
                               
                                $("#table_1").css({
                                   
                                    background:"#00CC00" });
                     
                      });


                         $("#5").click(function(){
                               
                                $("#table_1").css({
                                   
                                    background:"#8080C0" });
                     
                      });

</script>


</body>

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP