CS 202 Assignment 2 Complete Solution Fall 2018

CS 202 Assignment 2 Solution Fall 2018


<html>
<head>
    <title>CS 202 Assignment 2 Solution</title>
<!--CSS of the Assignment -->
    <style>
        .container{
            background-image: url('V.png');
            background-repeat: no-repeat;
            margin: 0 auto;
            width: 600px;
            height: 400px
        }
        h1{
    background-color: skyblue;
    text-align: center;
    display: flow-root;
    margin: 0 auto;
    width: 330px;
    padding: 15px;
        }
        .container > div{
                    background-color: deepskyblue;
    display: inline-block;
    padding: 8px;
    font-weight: bold;
    border-radius: 30px;
    margin-top: 15px;
            width: 160px;
            text-align: center;
            padding-bottom: 15px;
            padding-top: 15px;
    
}
        .bussines-requirement{
         margin-left: 20px;        
    
        }
        .system-requirement{
            float: right;
            margin-right: 20px;
    
        }
        .high-level-design{
            margin-left: 40px;
        }
        .low-level-design{
            float: right;
            margin-right: 44px;
        }
        .coding{
         margin-left: 60px;
        }
        .unit-testing{
            float: right;
            margin-right: 65px;
        }
        .functional-testing{
            margin-left: 85px;
                
        }
        .integration-testing{
            float: right;
            margin-right: 85px;
        
        }
        .integration-testing-2{
            margin-left: 100px;
            
        }
        .integration-testing-3{
            float: right;
            margin-right: 103px;
            
        }
        .system-testing{
            margin-left: 118px;
            
        }
        .acceptance-testing{
            float: right;
            margin-right: 118px;
        
        }
    </style>
    
    </head>
<body>
    <h1>Assignment No.2</h1>
    <br>
    <div class="container">
        
    <div class="bussines-requirement" style="display: none;">
        Business Requirements
        </div>
        <div class="system-requirement" style="display: none;">
       System Requirements
        </div>
        <br>
        <div class="high-level-design" style="display: none;">
       High Level Design
        </div>
        <div class="low-level-design" style="display: none;">
       Low Level Design
        </div>
        <br>
        <div class="coding" style="display: none;">
       Coding
        </div>
        <div class="unit-testing" style="display: none;">
       Unit Testing
        </div>
        <br>
        <div class="functional-testing" style="display: none;">
       Functional Testing
        </div>
        <div class="integration-testing" style="display: none;">
       Integration Testing
        </div>
        <br>
        <div class="integration-testing-2" style="display: none;">
       Integration Testing
        </div>
        <div class="integration-testing-3" style="display: none;">
       Integration Testing
        </div>
        <br>
        <div class="system-testing" style="display: none;">
       System Testing
        </div>
        <div class="acceptance-testing" style="display: none;">
       Acceptance Testing
        </div>
    </div>
    <!--container-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js "></script>
<script>
    
    $(function(){
        //Logic to show phases one by one
        var count = 0;
        
        function elements(){
            
    var modelDivs = ['bussines-requirement','high-level-design','coding','functional-testing',
                     'integration-testing-2','system-testing','acceptance-testing','integration-testing-3',
                     'integration-testing','unit-testing','low-level-design','system-requirement' ]
    
    var length = modelDivs.length;
            if (count < length){
        showData(modelDivs[count]);
    count++;
    }
            
        }
        
    setTimeout(elements,1000);
        
        function showData(element){
       $('.' + element).show(600,'swing');
        setTimeout(elements,900) 
    
        }
  
             
    });
    </script>
    </body>
</html>

Views: 94

Comment

You need to be a member of VU HELP to add comments!

Join VU HELP

SPONSORED LINKS

© 2019   Created by Muhammad Anwar Tahseen.   Powered by

Badges  |  Report an Issue  |  Terms of Service