jQuery的显示隐藏选择选项块

<div class="langs"> 
    <div class="flag"><h3>Country</h3> 
     <img id="flag" src="../media/images/flags/en.png"/> 
    </div> 
    <select class="select_country" name="country" id="select_country"> 
    <option>United States</option> 
    <option>Spain</option> 
    <option >France</option> 
    </select> 
    </div>

的Jquery：jQuery的显示隐藏选择选项块

$(".langs").hover(function() { 
    $("#select_country").slideToggle('500').css({"display":"block"}); 

    });

我不会在鼠标悬停显示向上选择块，并选择国家后隐藏选择选项块。

来源

2012-03-06 Goran Radovanovic

像这样的东西？

$(".langs").mouseenter(function() { 
    $("#select_country").show(); // SHOW #select_country on mouse over 
}); 

$(".langs").mouseleave(function() { 
    $("#select_country").hide(); // HIDE #select_country on mouse out 
});

您可能还需要使用.slideDown()和.slideUp()代替.show（）和.hide（）的

例子：http://jsfiddle.net/xUWK6/1/

来源

2012-03-06 14:24:17 Fabian

在Firefox好工作，但不工作在IE和谷歌浏览器！ – 2012-03-06 16:12:38

尝试使用'.mouseover（）'和'.mouseout（）'代替？ – Fabian 2012-03-06 16:47:15

我改变了选择 - >选项ul-> li标签，现在working.With select->选项在IE和Chrome不能正常工作（当我不会选择它消失的项目）。 – 2012-03-08 08:53:49

//By default hide the select box 
$("#select_country").hide(); 

//On mouseover it will show the select box 
$(".langs").mouseover(function() { 
    $("#select_country").show(); 
}); 

//Once you change the selection it will hide itself 
$("#select_country").change(function(){ 
    $(this).hide(); 
});

来源

2012-03-06 14:26:35 ShankarSangoli

jQuery的显示隐藏选择选项块

回答

相关问题