css - Parallax Website Lags -
i working on parallax website (here) , navigation div box making website lag.
the way can seem make smooth switch navigation div out unsorted list.
but when add button website , click it:
html:
<div id="nope" class="coolbutton"> <h4><span>nope.</span></h4> </div>
css:
#nope { text-align: center; } h4 { margin: 0; padding: 0; font-size: 600%; line-height: 1em; font-weight: bold; text-align: center; color: #fff; -webkit-transition: -webkit-transform .3s linear; } h4:hover { cursor: pointer; text-shadow: 3px 3px 10px rgba(0,0,0,.5); -webkit-transform: scale(1.25); -moz-transform: scale(1.25); } #nope:active:after { display: block; margin: 5em auto 0 auto; content: url(kc.png); } h4 span { padding: .1em .3em; line-height: 1em; -webkit-border-radius: .1em; -moz-border-radius: .1em; -webkit-transition: background-color .4s linear; } h4 span:hover { -webkit-box-shadow: 3px 3px 10px rgba(0,0,0,.5); -moz-box-shadow: 3px 3px 10px rgba(0,0,0,.5); background: rgba(141,211,234,.35) url(grad.png) repeat-x top left; } .coolbutton { margin: 0; padding: 10em; font: small "trebuchet ms", helvetica, arial, sans-serif; background-position: 0 500%; overflow: hidden; -webkit-transition: background-position .4s ease-out; } .coolbutton:hover { background: url(space.png) no-repeat 50% 0; }
the website smooth!
i need solution keep website smooth without changing of navigation menu.
Comments
Post a Comment