如何用JS给网页的一个DIV添加一个阴影,使鼠标移入的时候阴影出现鼠标移出的时候阴影消失

JavaScript015

如何用JS给网页的一个DIV添加一个阴影,使鼠标移入的时候阴影出现鼠标移出的时候阴影消失,第1张

     <!DOCTYPE html>  

    <html>  

    <head>  

    <meta content="text/html charset=gb2312" http-equiv="Content-Type">  

    <title>文哥讨厌IE</title>  

    <script type="text/javascript" src="jquery.js"></script>    

    <style type="text/css">  

    .box-shadow{  

        box-shadow: 10px 10px 10px 10px red  

        

    }  

      

    .obj{  

        border-radius:100px

        width:100px  

        height:100px  

        margin:50px auto  

        background:#eee      

    }  

    </style>  

    </head>  

      

    <body>  

        <div class="obj" ></div>  

        <script type="text/javascript">  

            $(document).ready(function(){  

                $(".obj").mouseover(function(){

                    $(".obj").addClass("box-shadow")

                })

                $(".obj").mouseout(function(){

                    $(".obj").removeClass("box-shadow")

                })

          })  

        </script>  

      

    </body>  

    </html>

选中图片,切换到【格式】选项卡中。

单击【调整】组中的“亮度”按钮,在弹出的列表中单击“图片修正选项”按钮,打开【设置图片格式】对话框。单击左侧窗格中的“阴影”按钮,切换到【阴影】面板中,单击【预设】按钮,从弹出的下拉列表中选择一种阴影效果,单击“关闭”按钮。