انجمن کدستانMoisrex

.et-wrapper{position:relative;-webkit-perspective:1200px;-moz-perspective:1200px;perspective:1200px;display:block;}

.et-page{width:100%;height:100%;position:absolute;top:0;left:0;visibility:hidden;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}

.et-page-current,.no-js .et-page{visibility:visible;z-index:1}

.no-js body{overflow:auto}

.et-page-ontop{z-index:999}

.et-rotate{cursor:pointer}

.et-wrapper {

height: 170px;

float: left;

margin: 15px;

}

.et-page {

padding: 8px;

}

.et-page:nth-child(1) {

background: #0ac2d2;

}

.et-page:nth-child(2) {

background: #f68dbb;

}

.et-page:nth-child(3) {

background: #60d7a9;

}

.et-page:nth-child(4) {

background: #fdc162;

}

.et-page:nth-child(5) {

background: #fd6a62;

}

.code-demos .et-wrapper{

margin: 0px;

}

.et-page button.et-rotate {

position: relative;

margin-top: 40px;

margin-left: 10px;

}

button.btn,input[type="submit"].btn{*padding-top:3px;*padding-bottom:3px;}button.btn::-moz-focus-inner,input[type="submit"].btn::-moz-focus-inner{padding:0;border:0;}

</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://dan-silver.github.io/ElementTransitions.js/build/elementTransitions.min.js"></script>

<div class="et-wrapper span4">

<button class="et-rotate btn" style="margin-top:250px;" et-in="rotateSlideIn" et-out="rotateSlideOut">Next</button>

<div class="et-page">

<h2>Page 1</h2>

</div>

<div class="et-page">

<h2>Page 2</h2>

</div>

<link rel="stylesheet" type="text/css" href="http://dan-silver.github.io/ElementTransitions.js/build/elementTransitions.css">

<link rel="stylesheet" type="text/css" href="http://dan-silver.github.io/ElementTransitions.js/demo/demo.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://dan-silver.github.io/ElementTransitions.js/build/elementTransitions.min.js"></script>

<div class="demo">

<div class="et-wrapper span4">

<button class="et-rotate btn" et-in="rotateSlideIn" et-out="rotateSlideOut">Next</button>

<div class="et-page">

<h2>Page 1</h2>

</div>

<div class="et-page">

<h2>Page 2</h2>

</div>

</div>