Dediğin şeyi anladım. Bu olayı efekt olarak JavaScript ve CSS ile yapman mümkün. Zaten HTML, CSS ve JavaScript hakkında bilgin varsa rahatlıkla istediğin şeyi yaparsın. Bunun için gerekli kodları ve basit bir örneği aşağıda veriyorum;
JavaScript Kodları
$(document).on('click','#boxes div', function(e){ $('body').addClass('show-menus'); }); $(document).on('click','.close', function(e){ $('body').removeClass('show-menus'); });CSS Kodları
#boxes div { display:inline-block; width:20%; padding-bottom:20%; background:red; cursor:pointer; } #boxes div:nth-child(even) { background:blue; } #boxes div:hover { opacity:0.5; } .left, .right { transition:600ms ease-in-out transform; position:fixed; top:0; height:100vh; } .left { background:green; width:60%; left:0; transform:translate3d(-100%,0,0); } .right { background:purple; width:40%; right:0; transform:translate3d(100%,0,0); } .show-menus .left, .show-menus .right { transform:translate3d(0,0,0); } .right .close { position:absolute; top:10px; right:0; cursor:pointer; }HTML Kodları
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="boxes"> <div></div><div></div><div></div><div></div><div></div> </div> <div class="left"></div> <div class="right"><button class="close">close</button></div>