我有一组嵌套的无序列表,用于下拉菜单结构:
UL > LI > DIV > UL > LI *n>A
我使用jQuery来为div和子ul的dropdown/display设置动画:
jQuery('ul.top-ul li.top-li').hover(function() {
jQuery(this).animate({height:"150px"},200);
jQuery(this).find('div').animate({height:"150px"
我正在制作一个具有jquery动画效果的下拉菜单,
var mexpand = false;
function toggleMenu() {
if (!mexpand) {
$('jQuery selector').css({ "background": "url('Images/bnbgmenu.jpg') repeat-x top left" });
$("#NavDiv").animate({ height: "200px" });
me
对于我的下拉菜单,我有以下jquery代码:
var active = 0;
$(document).ready(function(){
jQuery("#dropmenu ul").css({display:"none"});
// For 1 Level
jQuery("#dropmenu li:has(ul) a").append('');
jQuery("#dropmenu li ul a span").text('');
// For 2 L
我已经放了css动画下拉菜单,你可以在这里看到:
/* CSS used here will be applied after bootstrap.css */
.dropdown .dropdown-menu {
animation-name: example;
animation-duration: 1s;
}
@keyframes example {
from {
transform: scale(0);
opacity: 0;
-webkit-transition: all .2s linear;
-o-transition: all
我想我的问题与这个问题相反:
我正在用Google脚本构建一个UI。我有一个选择框,在一个更大的容器div中。当单击父div时,我希望能够使用jQuery运行动画,但我不希望在单击复选框时运行动画。我试过使用stopPropagation,但这没有帮助。当前,当单击div本身或选择下拉菜单时,动画就会运行:
var ISDOWN = true; //global to track whether div is down or up
$("#outer-container").click(
function(e) {
e.stopPropagation()