Jquery：devexpressを使用してカスタマイズしたメニューを作成できますか？

devexpressを使用してメニューをカスタマイズできるかどうか疑問に思っています。現在、私ができるメニューは水平または垂直だけです。しかし、私は以下のフォーマットでカスタマイズされたメニューが必要な場合はどうなりますか？私はそれを試みたにもかかわらず成功しませんでした。Jquery：devexpressを使用してカスタマイズしたメニューを作成できますか？

は、これは私が必要とするものである：

<!DOCTYPE html> 
<html> 

<head> 
<meta name="description" content="carousel expanding"> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>Check</title> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
    <link href="https://fonts.googleapis.com/css?family=Montserrat:500,600" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/css?family=Lato:400,700" rel="stylesheet"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
    <link rel="stylesheet" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.spa.css"> 
    <link rel="stylesheet" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.common.css"> 
    <link rel="stylesheet" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.light.css"> 
    <link rel="stylesheet" href="style.css"> 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

</head> 
<div class="myDevClass" id="menu"></div> 

<script> 
// For DevExpress Menu 
       var menuItems = [ 
           { 
            text: "Animal", 
            items: [ 
             { text: "Cat" }, 
             { text: "Dog" }, 
             { text: "Elephant" }, 
             { text: "Lion" }, 
             { text: "Tiger" }, 
             { text: "Cow" } 
            ] 
           }, 
           { 
            text: "Birds", 
            items: [ 
             { text: "Peigion" }, 
             { text: "Crow" }, 
             { text: "Mynah" }, 
             { text: "Swan" }, 
             { text: "Sparrow" }, 
             { text: "Humming Bird" } 
            ] 
           } 

          ]; 
          $(function() { 
           $("#menu").dxMenu({ 
            items: menuItems 
           }); 
          }); 
</script>

が、私は同じのための任意の研究材料を見つけるdidntは：以下

は現在、私の横のメニューを提供し、私がしようとしているコードです。私はいくつかのJqueryを使用してそれを達成することができますか？

出典

2017-04-10 sTg

私はあなたがこの目的のためにグループ化されたdxListを使用することをお勧め：

$("#list").dxList({ 
    items: [ 
     { 
      key: "Animal", 
      items: [ 
       { text: "Cat" }, 
       { text: "Dog" }, 
       { text: "Elephant" }, 
       { text: "Lion" }, 
       { text: "Tiger" }, 
       { text: "Cow" } 
      ] 
     }, 
     { 
      key: "Birds", 
      items: [ 
       { text: "Peigion" }, 
       { text: "Crow" }, 
       { text: "Mynah" }, 
       { text: "Swan" }, 
       { text: "Sparrow" }, 
       { text: "Humming Bird" } 
      ] 
     } 
    ], 
    grouped: true 
});

また、メニューを変更するには、「DX-リスト・グループ」用のカスタムCSSルールを使用すると「DX-リスト項目」クラススタイル

出典

2017-04-10 12:38:06

Jquery：devexpressを使用してカスタマイズしたメニューを作成できますか？

答えて

関連する問題