Ignore:
Timestamp:
2014-12-10T14:04:54+13:00 (9 years ago)
Author:
bmt11
Message:
 
Location:
other-projects/nz-flag-design/trunk/render-3d
Files:
4 added
4 edited

Legend:

Unmodified
Added
Removed
  • other-projects/nz-flag-design/trunk/render-3d/CSS/button.css

    r29547 r29575  
    11.myButton {
    2     -moz-box-shadow: 0px 1px 14px 11px #f0f7fa;
    3     -webkit-box-shadow: 0px 1px 14px 11px #f0f7fa;
    4     box-shadow: 0px 1px 14px 11px #f0f7fa;
    5     background-image:url("../images/snowButton.jpg");
    62    background-color:#33bdef;
    73    -moz-border-radius:42px;
    84    -webkit-border-radius:42px;
    9     border-radius:42px;
     5    border-radius:100%;
    106    border:4px solid #057fd0;
    11     display:inline-block;
     7    display: block;
    128    cursor:pointer;
    139    color:#ffffff;
    14     font-family:Permanent Marker;
    15     font-size:28px;
    16     padding:25px 60px;
    17     text-decoration:none;
    18     text-shadow:2px 2px 20px #5b6178;
     10    padding:50px;
     11    float: right;
     12    margin: 10% 15% 10% 10%;
    1913}
    2014.myButton:hover {
  • other-projects/nz-flag-design/trunk/render-3d/flag.html

    r29547 r29575  
    1818                position: fixed;
    1919            }
    20 
    21             #info {
     20           
     21            #menuContainer{
     22                position: fixed;
     23                right: -18vw;
     24                float: right;
     25                width: 25vw;
     26                transition: right 0.5s;
     27                background-image: url("./images/slider.png");
     28                background-size: 25vw 150vh;
     29                background-position: center;
     30            }
     31
     32            #weatherMenu {
    2233                text-align: center;
    23                 padding: 10px;
     34                padding: 0px;
     35                width: 20vw;
    2436                z-index: 10;
    25                 width: 100%;
    26                 position: absolute;
    27                 top: 10%;
    28             }
    29 
    30             a {
    31                 text-decoration: underline;
    32                 cursor: pointer;
     37                height: 100vh;
     38                position: relative;
     39                float: right;
     40            }
     41           
     42            #arrow{
     43                float: left;
     44                background-image: url("./images/arrow.png");
     45                background-position: center;
     46                background-size: 5vw 10vh;
     47                margin: auto;
     48                right: 1vw;
     49                width: 5vw;
     50                height: 10vh;
     51                position: relative;
     52                border-radius: 100%;
     53                top: 45vh;
     54                z-index: 9;
     55                transition: transform 0.5s;
     56                transform: rotate(360deg);
    3357            }
    3458           
     
    3761
    3862    <body>
    39         <div id="info" style="color : white">
    40             Toggle: <a onclick="fine = !fine;">Sunny</a> |
    41             <a onclick="wind = !wind;">Wind</a> |
    42             <a onclick="raining = !raining;">Rain</a> |
    43             <a class="myButton" onclick="snowing = !snowing;">Snow</a>
    44            
     63        <div id="menuContainer">
     64            <div id="weatherMenu" style="color : white">
     65                <!--Toggle:
     66                <a onclick="wind = !wind;">Wind</a> |-->
     67                <a class="myButton" style="background-image:url('./images/sunButton.jpg')" onclick="fine = !fine;"></a>
     68                <a class="myButton" style="background-image:url('./images/rainButton.jpg')" onclick="raining = !raining;"></a>
     69                <a class="myButton" style="background-image:url('./images/snowButton.jpg')" onclick="snowing = !snowing;"></a>
     70            </div>
     71            <div id="arrow" onclick="openclose()">
     72            </div>
    4573        </div>
     74       
     75       
     76        <script type="text/javascript">
     77            var open = false;
     78            function openclose(){
     79                if (open){
     80                    document.getElementById("menuContainer").style.right = "-20vw";
     81                    document.getElementById("arrow").style.transform = "rotate(360deg)";
     82                }else{document.getElementById("menuContainer").style.right = "0vw";
     83                    document.getElementById("arrow").style.transform = "rotate(180deg)";
     84                }
     85                open = !open;
     86               
     87            }
     88        </script>
     89       
    4690
    4791        <script type="text/javascript" src="./Flag_files/Three.js"></script>
     
    221265                    clothTextures[i] = THREE.ImageUtils.loadTexture( flags[i] );
    222266                    //clothTextures[i].needsUpdate = true;
    223                     clothTextures[i].wrapS = clothTextures[i].wrapT = THREE.RepeatWrapping;
     267                    clothTextures[i].wrapS = clothTextures[i].wrapT = THREE.ClampToEdgeWrapping;
    224268                    clothTextures[i].anisotropy = 16;
    225269                }
     
    232276                arrow = new THREE.ArrowHelper( new THREE.Vector3( 0, 1, 0 ), new THREE.Vector3( 0, 0, 0 ), 50, 0xff0000 );
    233277                arrow.position.set( -200, -50, -200 );
    234                 scene.add( arrow );
     278                //scene.add( arrow );
    235279
    236280   
Note: See TracChangeset for help on using the changeset viewer.