Skip to content

harveen54/TestingRepo

BranchesTags

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
GrantAWish CSR/GrantAWish
GrantAWish CSR/GrantAWish
 
 
GrantAwishSQL
GrantAwishSQL
 
 
README.md
README.md
 
 

Repository files navigation

<style> .MainContainer { display:inline-block; position:relative; transform-origin: 0px 35px; transition: all .3s ease-in; } .SubContainerHeader { display: inline-block; height:40px; width:250px; position: absolute; } .SubContainer { display: inline-block; height:340px; width:250px; top:45px; position: absolute; } .SubContainerColorGrey { background:grey; } .SubContainerColorRed { background:Red; } .anime { transform: rotateZ(90deg); 
	}
	body{
		background-image: url(paisley.png);
		background-color: black;
	}
</style>
</head>
<body >
	
	
	<div class="MainContainer">
		<div class="SubContainerHeader SubContainerColorGrey">Close</div>
		<div class="SubContainer SubContainerColorRed">
			<div class="ContentMenu">
				<div>
				<ul>
					<li>
						This is content
					</li>
				</ul>						
				</div>
			</div>
		</div>
	</div>
	
	
<svg width="580" height="400" xmlns="http://www.w3.org/2000/svg">
<title>background</title> <title>Layer 1</title> 
            <rect id="Rect15" height="3" stroke="0" width="5" fill="#A4C8D6">
                <animateMotion id="AnimateMotion15" begin="AnimateMotion14.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect>
            <rect id="Rect16" height="3" stroke="0" width="5" fill="#A4C8D6">
                <animateMotion id="AnimateMotion16" begin="AnimateMotion15.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect17" height="3" stroke="0" width="5" fill="#AFCDD8">
                <animateMotion id="AnimateMotion17" begin="AnimateMotion16.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect18" height="3" stroke="0" width="5" fill="#AFCDD8">
                <animateMotion id="AnimateMotion18" begin="AnimateMotion17.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect19" height="3" stroke="0" width="5" fill="#AFCDD8">
                <animateMotion id="AnimateMotion19" begin="AnimateMotion18.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect20" height="3" stroke="0" width="5" fill="#BED6E0">
                <animateMotion id="AnimateMotion20" begin="AnimateMotion19.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect21" height="3" stroke="0" width="5" fill="#BED6E0">
                <animateMotion id="AnimateMotion21" begin="AnimateMotion20.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect22" height="3" stroke="0" width="5" fill="#BED6E0">
                <animateMotion id="AnimateMotion22" begin="AnimateMotion21.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect23" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion23" begin="AnimateMotion22.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect24" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion24" begin="AnimateMotion23.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect25" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion25" begin="AnimateMotion24.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect26" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion26" begin="AnimateMotion25.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect27" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion27" begin="AnimateMotion26.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect28" height="3" stroke="0" width="5" fill="#fff">
                <animateMotion id="AnimateMotion28" begin="AnimateMotion27.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>

            </rect><rect id="Rect29" height="3" stroke="0" width="5" fill="#00ff00">
                <animateMotion id="AnimateMotion29" begin="AnimateMotion28.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect30" height="3" stroke="0" width="5" fill="#00ff00">
                <animateMotion id="AnimateMotion30" begin="AnimateMotion29.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect31" height="3" stroke="0" width="5" fill="#00ff00">
                <animateMotion id="AnimateMotion31" begin="AnimateMotion30.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>

            </rect>
<rect id="Rect32" height="3" stroke="0" width="5" fill="#0000ff">
                <animateMotion id="AnimateMotion32" begin="AnimateMotion31.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect>
<rect id="Rect33" height="3" stroke="0" width="5" fill="#fff">
                <animateMotion id="AnimateMotion33" begin="AnimateMotion32.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
</rect><rect id="Rect34" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion34" begin="AnimateMotion33.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect35" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion35" begin="AnimateMotion34.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect36" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion36" begin="AnimateMotion35.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect37" height="3" stroke="0" width="5" fill="#fff">
                <animateMotion id="AnimateMotion37" begin="AnimateMotion36.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
</rect>
 <rect id="Rect38" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion38" begin="AnimateMotion37.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect39" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion39" begin="AnimateMotion38.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect40" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion40" begin="AnimateMotion39.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect41" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion41" begin="AnimateMotion40.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect42" height="3" stroke="0" width="5" fill="#fff">
                <animateMotion id="AnimateMotion42" begin="AnimateMotion41.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
</rect><rect id="Rect43" height="3" stroke="0" width="5" fill="#D3E2E8">
                <animateMotion id="AnimateMotion43" begin="AnimateMotion42.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect44" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion44" begin="AnimateMotion43.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect45" height="3" stroke="0" width="5" fill="#E1EBEF">
                <animateMotion id="AnimateMotion45" begin="AnimateMotion44.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
            </rect><rect id="Rect46" height="3" stroke="0" width="5" fill="#fff">
                <animateMotion id="AnimateMotion46" begin="AnimateMotion45.begin+0.08s" dur="2s" repeatCount="indefinite">
                    <mpath xlink:href="#svg_1" />
                </animateMotion>
</rect>
 
 </g>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script> <script> $(document).ready(function(){ $('.SubContainerHeader').click(function(){ $('.MainContainer').toggleClass('anime'); 
			});
		});
	</script>
</body>

About

No description, website, or topics provided.

Resources

Readme
Activity

Stars

0 stars

Watchers

3 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •  

Languages