Thursday 15 August 2013

JQuery - Animate using Canvas in Div tag to Draw a Flag - (CSS Source)

CSS Source


<style type="text/css">
#sf
{width: 0px;
height: 0px; border-left-style: solid; border-left-color: #FF6633; border-right-style: solid; border-right-color: #FF6633; border-top-style: solid; border-top-color: #FF6633; border-bottom-style: none; border-bottom-color: #000000;

}


#wh{
border-bottom: medium solid ; margin: -20px auto auto 0px; width: 0px; height: 41px; border-left-color: lightgray; border-left-width: medium; border-right-color: Lightgray; border-right-width: medium; border-top-color: #FF6633; border-top-width: medium; border-bottom-style: none; border-top-style: solid;border-right-style: solid;border-left-style: solid;
}

.name
{
display:none;
color:deepskyblue;
font-size:25px;
margin: 25px auto auto 50px;
}

.bt{
border-top: medium solid green; border-bottom: medium none #000000; margin: 0px 0px auto auto; width: 0px; height: 0px; border-left-color: #000000; border-left-width: medium; border-right-color: #00FF00; border-right-width: medium;
}
#gr
{
width: 1px;
border-top: medium solid green; border-bottom: medium none #000000; margin: -20px auto auto 0px;  height: 40px; border-left-color: green; border-left-width: medium; border-right-color: green; border-right-width: medium;border-right-style: solid; border-left-style: solid;
}
.br
{
display:none;
border-style: none none none none; border-width: medium; border-color: #000000; height: 130px; width: 210px;margin: -350px 50px auto auto;
}


#rt
{

border-color: green; border-width: medium;  margin-left: 211px; width: 1px; height: 1px; border-left-style: solid;margin-top:-39px;
}

#c{
display:none;
}
#sfc
{
width:0px;
height:0px;
background-color:#FF6633;

}
#grc
{
width:0px;
height:0px;
background-color:green;

}
#s1
{
display:none;
}
#s2
{
display:none;
}
#s3
{
display:none;
}
#s4
{
display:none;
}
#s5
{
display:none;
}
#s6
{
display:none;
}
#s7
{
display:none;
}
#s8
{
display:none;
}
#s9
{
display:none;
}
#s10
{
display:none;
}
#s11
{
display:none;
}
#s12
{
display:none;
}
#s13
{
display:none;
}
#s14
{
display:none;
}
#s15
{
display:none;
}
#s16
{
display:none;
}
#s17
{
display:none;
}
#s18
{
display:none;
}
#s19
{
display:none;
}
#s20
{
display:none;
}
#s21
{
display:none;
}
#s22
{
display:none;
}
#s23
{
display:none;
}
#s24
{
display:none;
}
#s25
{
display:none;
}
#stick
{

border-style: none solid none none; border-width: 12px; border-color: #000000; height: 1px; width:25px;border-color:#B1B8B7;
}</style>