• 写着玩: 图片 圆盘


    http://vlog.it/  参考网站

    <style type="text/css">
    #panel{position:absolute;left:500px;top:400px;}
    #panel > img{position:absolute;}
    .ts0{transform:rotate(0deg);}
    .ts1{transform:rotate(30deg);}
    .ts2{transform:rotate(60deg);}
    .ts3{transform:rotate(90deg);}
    .ts4{transform:rotate(120deg);}
    .ts5{transform:rotate(150deg);}
    .ts6{transform:rotate(180deg);}
    .ts7{transform:rotate(210deg);}
    .ts8{transform:rotate(240deg);}
    .ts9{transform:rotate(270deg);}
    .ts10{transform:rotate(300deg);}
    .ts11{transform:rotate(330deg);}
    </style>
    <div id="panel">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts0">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts1">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts2">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts3">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts4">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts5">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts6">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts7">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts8">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts9">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts10">
    <img src="http://i.vimeocdn.com/video/94472021_200x150.jpg" class="ts11">
    </div>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
    $(function(){
        var r=300;
        for(var i=0;i<12;i++){
            var theta = (30*i)/180;
            var y=Math.sin(theta*Math.PI)*r;
            var x=Math.cos(theta*Math.PI)*r;
            var obj=$("img").eq(i);
            obj.css("left",x);
            obj.css("top",y);
            //console.log(theta+"   ----------- "+x+"    ,  " +y);
        }
    });
    </script>
  • 相关阅读:
    “铁大失物帮”Alpha版使用说明
    绩效评估
    改进方案评论
    意见汇总
    对其他团队项目的意见和建议
    冲刺周期
    属于我的专属博客团队地址
    第一个冲刺周期-第三天
    第一个冲刺周期-第二天
    动手动脑与动手
  • 原文地址:https://www.cnblogs.com/qq21270/p/3994613.html
Copyright © 2020-2023  润新知