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-목록 그룹"과 "DX-목록 항목"클래스의 사용자 정의 CSS 규칙을 사용하여 메뉴를 변경하려면 스타일

출처

2017-04-10 12:38:06

Jquery : devexpress를 사용하여 사용자 정의 메뉴를 만들 수 있습니까?

답변

관련 문제