【チュートリアルで学ぶ】レスポンシブ対応のオフキャンバスメニューをCSS3で作成する方法本チュートリアルでは、CSS3のtransitionを使用して「スライド型」および「プッシュ型」のオフキャンバスメニューを作成していきます。メニューは最初は隠れていますが、ボタンをクリックすると現れるという仕組みです。 Get Source Code View the Demo まずはこの２つのメニューの違いを定義すると： ・スライドメニューはコンテンツの上にスライドする形で表示される ・プッシュメニューはスライドしながらコンテンツを押しやる形で表示される 先に進む前におさえておきたい重要ポイントは以下です。 ・CSS3のtransitionでスムーズな動きを演出しているため、古いブラウザでは機能しません ・Classの管理を楽にするためjsを使用しています ・IE8以降でサポートされているJavascriptのquerySelectorおよびquerySelectorAllを使用していま
