2017-12-20 3 views
-3

私は、レターの代わりに、ページの右側からサイドメニューを開いて設定する方法を理解できません。Sidenav HTMLマテリアライズ

提案がありますか?

Sidenav:http://materializecss.com/side-nav.html

<body> 
<!-- Scripts--> 
    <script src="js/jquery-3.2.1.js"></script> 
    <script src="js/materialize.js"></script> 
    <script src="js/init.js"></script> 
    <script type="text/javascript"> 
    $('.button-collapse').sideNav({ 
      menuWidth: 300, 
      closeOnClick: true, 
      edge: 'right', // <--- CHECK THIS OUT 
     } 
    ); 
     $('.collapsible').collapsible(); 
    </script> 
    <div class="background"> 
     <nav> 
      <ul class="right hide-on-med-and-down"> 
      <li><a href="#!">First Sidebar Link</a></li> 
      <li><a href="#!">Second Sidebar Link</a></li> 
      </ul> 
      <ul id="slide-out" class="side-nav fixed"> 
       <li class="bold"><a href="#!" class="waves-effect waves-teal">First Sidebar Link</a></li> 
       <li class="bold"><a href="#!" class="">Second Sidebar Link</a></li> 
       <li class="no-padding"> 
       <ul class="collapsible collapsible-accordion"> 
        <li> 
        <a class="collapsible-header waves-effect waves-teal">Dropdown<i class="mdi-navigation-arrow-drop-down"></i></a> 
        <div class="collapsible-body"> 
         <ul> 
         <li><a href="#!">First</a></li> 
         <li><a href="#!">Second</a></li> 
         <li><a href="#!">Third</a></li> 
         <li><a href="#!">Fourth</a></li> 
         </ul> 
        </div> 
        </li> 
       </ul> 
       </li> 
      </ul> 
      <a href="#" data-activates="slide-out" class="button-collapse"><i class="mdi-navigation-menu">asd</i></a> 
     </nav> 
</body> 

これは私が実行しているにしようとしているコードがあるが、これは適切な答えが欠けているようだ

+1

[左側の代わりにMaterialize SideNavを開くにはどうすればいいですか?] https://stackoverflow.com/questions/37207668/open-slidenav-from-right-side-in-materialize-design) – Aurora0001

+0

既に試してみましたが、私のためには役に立たない – Fanto

+0

この場合、[編集]試したコードを明確にするためにあなたの投稿を読んで、正しい方向に向けることができます。 – Aurora0001

答えて

0

左からメニュー開いたまま。私はOPがその問題を解決するために管理し、誰かに返信を要求しているので、OPはその投稿を回答としてマークすることができます。しかし、以下の私の2セントです:単に渡し、「オプション」のために、右からSideNavを開くには SideNav Initalization

var instance = new M.Sidenav(elem, options); //Initialize 

:マテリアライズ1.0と仮定すると

が使用され、一つはSideNavを作成し、初期化するドキュメントをたどりますこのようなオブジェクト:

var options = {}; 
options.edge = "right"; //SideNav will slide in from right 

私はオプションの部分は多分、特にJavaScriptに新しい人々のために、1.0アルファのマニュアルに明確に十分に記載されていないことに同意するだろう。

古いバージョンのドキュメントは実際にはより明確です。右からのSideNavを開くためには、OPのようにinitialization using JQueryが必要です。また、@ Aurora0001で提供されているJSFiddleが私のために働いていることを確認し、IE11、Chrome 63、FF 57でテストしました。

関連する問題