2015-01-26 4 views
2

현재 텍스트 만 클릭 할 수 있으며 응용 프로그램에서 지정된 경로로 사용자를 이동하는 동안 li 드롭 다운의 다른 부분을 클릭하면 아무 것도 결과로 표시되지 않습니다. 'link_to에 목록 항목을 래핑하는 방법?

<%= link_to(current_user) do %> 
...stuff to wrap here... 
<%=end%> 

나는 당신을 생각 : CSS를 여기

<li id='dropdown'> 
    <%= current_user.email %> ▾ 
     <ul id='dropdown-list'> 
      <li> <%= link_to "My Account", current_user %> </li> 
      <li><%= link_to "Log Out", session_path("current"), method: :delete %></li> 
     </ul> 
</li> 

됩니다 :

#dropdown-list { 
    padding: 0; 
    position: absolute; 
    top: 48px; 
    width: 150px; 
    -webkit-box-shadow: none; 
    -moz-box-shadow: none; 
    box-shadow: 0px 2px 5px #bcbfc3; 
    display: block; 
    opacity: 0; 
    visibility: hidden; 
    -webkit-transiton: opacity 0.2s; 
    -moz-transition: opacity 0.2s; 
    -ms-transition: opacity 0.2s; 
    -o-transition: opacity 0.2s; 
    -transition: opacity 0.2s; 
} 

#dropdown-list li { 
    background: #fff; 
    display: block; 
    color: #7D818A; 
} 
#dropdown-list li:hover{ 
background-color: #ECECEE; 
} 

#dropdown:hover ul { 
    display: block; 
    opacity: 1; 
    visibility: visible; 
} 

답변

2

당신은 같은 블록을 만들어 link_to을 포장 할 수 있습니다 여기에

코드입니다 아마도 다음과 같은 것을 원할 것입니다 :

<li id='dropdown'> 
    <%= current_user.email %> ▾ 
     <ul id='dropdown-list'> 
      <%= link_to(current_user) do %> 
      <li>My Account</li> 
      <%= end %> 
      <li><%= link_to "Log Out", session_path("current"), method: :delete %></li> 
     </ul> 
</li> 
+0

은, ([목록은 목록 항목을 포함한다] https://developer.mozilla.org/en-US/docs/Web/HTML/요소/ul). 이 ** 아마 ** 호환성을 너무 많이 상하게하지는 않겠지 만 미안한 것보다 안전합니다. –

1

CSS 솔루션 :이 질문에 대답 않지만

#dropdown-list>li>a{ 
    display: block; 
} 
관련 문제