realshadow实现鼠标模拟光照产生阴影跟随效果代码

代码语言:html

所属分类:布局界面

代码描述:realshadow实现鼠标模拟光照产生阴影跟随效果代码

代码标签: 模拟 光照 产生 阴影 跟随 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta http-equiv="X-UA-Compatible" content="chrome=1">


    <style>
        body {
            background: #fff url(white_brick_wall.png);
            font: 15px "Helvetica Neue",Calibri,Helvetica,Arial,sans-serif;
            color: #666;
            padding: 0;
            margin: 0;
        }

        h1 {
            margin-bottom: 0;
            color: #999;
        }

        a {
            color: #66f;
            text-decoration: none
        }

        .container {
            text-align: center;
            padding: 10px 0;
        }
        /*.wrapper {margin:0 300px}*/

        .block {
            margin: 20px 30px;
            display: inline-block;
            width: 50px;
            height: 50px;
        }

        .big {
            width: 380px;
            height: 100px;
            line-height: 100px;
            margin-bottom: 200px;
            border-radius: 10px;
        }

        .c {
            background: rgba(193,193,193,.5)
        }
        .cr {
            background: rgba(255,0,0,.5)
        }
        .cg {
            background: rgba(0,200,0,.5)
        }
        .cb {
            background: rgba(0,0,255,.5)
        }
        .crg {
            background: rgba(255,255,0,.5)
        }
        .cgb {
            background: rgba(0,200,255,.5)
        }
        .cbr {
            background: rgba(255,0,255,.5)
        }
        .crgb {
            background: rgba(255,255,255,.5)
        }

        .round {
            border-radius: 10px
        }
        .circle {
            border-radius: 30px
        }
        .ur {
            border-radius: 5px 50px 5px 5px
        }
        .ll {
            border-radius: 5px 5px 5px 50px
        }

        .rffdgad {
            position: absolute;
            right: 10px;
            top: 183px;
        }

        a#forkme_banner {
            position: absolute;
            top: 0;
            left: 0;
            width: 138px;
            height: 138px;
            display: block;
            background: transparent url(images/fork-sprite.png) 0 0 no-repeat;
            t.........完整代码请登录后点击上方下载按钮下载查看

网友评论0