随机获取颜色作业

Original 2019-04-24 18:43:30 197
abstract:<!DOCTYPE html> <html>     <head>         <meta charset="utf-8">      &
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        <title>随机获取颜色作业</title>
        <style type="text/css">
            a{ 
                width:100px ; 
                height: 100px;  
                float: left; 
                display: block; 
                margin: 20px; 
                line-height: 100px; 
                text-align: center;
                border-radius: 50px; 
                text-decoration: none; 
                color: #fff;
                
            }
        </style>
    </head>
    <body>
        <a href="">1</a>
        <a href="">2</a>
        <a href="">3</a>
        <a href="">4</a>
        
        <script type="text/javascript">
            function bgcolor(tag){
                var tagname=document.getElementsByTagName(tag);
                var len=tagname.length;
                for(var i=0;i<len;i++){
                    tagname[i].style.backgroundColor='rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')';
                    tagname[i].innerText=Math.floor(Math.random()*1000)
                    
                }
                
            }
            $(document).ready(function(){
                bgcolor('a');
                $('a').mouseover(function(){
                    $bg=$(this).css('backgroundColor');
                    //alert($bg);
                    $(this).css('box-shadow','0px 0px 20px' + $bg );
                    $(this).css('border-radius','20px');
                });
                $('a').mouseleave(function(){
                    $(this).css('box-shadow','none');
                    $(this).css('border-radius','50px');
                });
                
            });
            
            
            
        </script>
    </body>
</html>


Correcting teacher:查无此人Correction time:2019-04-25 13:37:55
Teacher's summary:完成的不错,看你今天写了不少作业。继续加油。

Release Notes

Popular Entries