JS judge Odd even realize hidden display function and CSS stereo button

Hello! Long time no see, today also not prepared what technology, knowledge want and everyone to see a face, a JS judge odd even to achieve CSS style, feel the biggest use is the page navigation. Just a little bit of technology.

Happy Labor

When! When! When! When!

This is to judge the odd even implementation of the stereo button, color good self-change, the following is the code I throw to everyone:

CSS: Code

<style type= "text/css" > Body{width:400px;Height:300px;margin:0 Auto;Margin-top:60px; }#div{width:130px;Height:0px;Border-radius:0px 0px 5px 5px;Background-color:#808080;Box-shadow:0 9px 0 #808080, 0 3px 25px rgba (0, 0, 0, 0.7);transition:All . 3s;Margin-top:3px;Color:#FFFFFF;font-size:20px;Font-weight:Bold;Overflow:Hidden;text-align:Center; }#div P{Text-shadow:0px 0px 0px #272822;transition:All 2.5s; }. Button{width:130px;Height:35px;Border-radius:4px;Box-shadow:0 9px 0 #DB1F05, 0 9px 25px rgba (0, 0, 0, 0.7);Background-color:#DB5705;transition:All 0.1s;text-align:Center;Line-height:35px;font-size:14px;Color:#FFFFFF;User-select:None;cursor:Pointer;Font-weight: -; }</style>

HTML code:

<Divclass= "button"onclick= "Dianji ()">Dot Me dot I</Div><DivID= "Div"><P>Casa</P><P>Tile</P><P>Andy</P><P>Card</P></Div>

jquery Code:

<script type= "Text/javascript" >varX=0; functionDianji () {x++; //Judging odd even numbers using jquery to achieve results                if(x%2==0){            $("#div"). css ({"Height": "0px",            }) $(". Button"). css ({"Box-shadow": "0 9px 0 #DB1F05, 0 9px 25px rgba (0, 0, 0, 0.7)",            }) $("P"). css ({"Text-shadow": "0px 0px 0px #272822"            })                        }Else{        $("#div"). css ({"Height": "200px",                            }) $(". Button"). css ({"Box-shadow": "0 3px 0 #DB1F05, 0 3px 6px rgba (0, 0, 0, 0.9)",            }) $("P"). css ({"Text-shadow": "5px 5px 5px #272822"})}} </script>

At last

I wish you a pleasant 51 holiday, Bye ~

JS judge Odd even realize hidden display function and CSS stereo button