CSS展示框永久

我有一個代碼，該功能是下拉式的。下拉可以順利進行。現在我想點擊評論時，框會顯示永久性並且會與外部點擊關閉。CSS展示框永久

在這種情況下，當我點擊評論，框顯示，當我拖動鼠標輸入評論，它關閉。

那麼我該如何保留這個盒子？

.dropdown { 
position:relative; 
} 

.dropdown-menu { 
position:absolute; 
top:100%; 
left:0; 
z-index:1000; 
display:none; 
float:left; 
min-width:300px; 
list-style:none; 
background-color:#fff; 
border:1px solid rgba(0,0,0,0.2); 
border-right-width:2px; 
border-bottom-width:2px; 
-webkit-border-radius:5px; 
-moz-border-radius:5px; 
border-radius:5px; 
-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2); 
-moz-box-shadow:0 5px 10px rgba(0,0,0,0.2); 
box-shadow:0 5px 10px rgba(0,0,0,0.2); 
-webkit-background-clip:padding-box; 
-moz-background-clip:padding; 
background-clip:padding-box; 
margin:1px 0 0; 
padding:4px 0; 

.navbar .dropdown-menu:after { 
position:absolute; 
top:-6px; 
left:10px; 
display:inline-block; 
border-right:6px solid transparent; 
border-bottom:6px solid #fff; 
border-left:6px solid transparent; 
content:''; 

.open .dropdown-menu { 
display:block; 
} 

<span class="navbar"> 
      <span class="dropdown"> 
       <a data-toggle="dropdown" class="comment" href="#">Comment</a> 
       <ul class="dropdown-menu"> 
        <li><input type="text"></li> 
       </ul> 
      </span> 
      </span>

來源

2012-08-13 X-men

你可以創建http://jsfiddle.net/一個例子更好地理解 – sandeep 2012-08-13 09:14:44

嗨sandeep，這是例子：http://jsfiddle.net/laststandxmen/H3Vnw/ – 2012-08-13 09:22:40

@ X-men：你不必將jquery的代碼粘貼在小提琴上。只需從左邊的「選擇框架」部分中的下拉菜單中選擇它 – 2012-08-13 09:49:35

根據我的理解可能是那個你想要http://jsfiddle.net/H3Vnw/1/。這樣寫

$('.comment').click(function(){ 
    $('.dropdown-menu').css({'display': 'block'}); 
});

修訂

這樣寫

var com = $('.comment'); 
var menu = $('.dropdown-menu'); 

     com.click(function() { 
      menu.show(); return false; 
     }); 

     $(document).click(function() { 
      menu.hide(); 
     }); 

     menu.click(function(e) { 
      e.stopPropagation(); 
     });

入住這http://jsfiddle.net/H3Vnw/4/

來源

2012-08-13 09:30:26 sandeep

感謝分享sandeep，我已嘗試使用此代碼並開展工作。那麼我怎樣才能關閉盒子表格？ – 2012-08-13 09:44:12

您好sandeep，如何右鍵單擊。我試過你的代碼，但是當右鍵點擊時，它關閉了這個盒子。 – 2012-08-13 10:03:37

CSS展示框永久

回答

相關問題