在不使用现代化的情况下实现此结果

Achieve this outcome without the use of Modernizr?

本文关键字:情况下 实现 结果 现代化      更新时间:2023-09-26

出于我宁愿不进入的原因。我正在尝试实现此菜单的效果:

演示: http://tympanus.net/codrops/2013/04/19/responsive-multi-level-menu/

但是没有使用Modernizr可能会使用JQuery。代码的这一部分是让我绊倒的:

$.DLMenu.prototype = {
    _init : function( options ) {
// options
        this.options = $.extend( true, {}, $.DLMenu.defaults, options );
        // cache some elements and initialize some variables
        this._config();
        var animEndEventNames = {
                'WebkitAnimation' : 'webkitAnimationEnd',
                'OAnimation' : 'oAnimationEnd',
                'msAnimation' : 'MSAnimationEnd',
                'animation' : 'animationend'
            },
            transEndEventNames = {
                'WebkitTransition' : 'webkitTransitionEnd',
                'MozTransition' : 'transitionend',
                'OTransition' : 'oTransitionEnd',
                'msTransition' : 'MSTransitionEnd',
                'transition' : 'transitionend'
            };
        // animation end event name
        this.animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ] + '.dlmenu';
        // transition end event name
        this.transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ] + '.dlmenu';
        // support for css animations and css transitions
        this.supportAnimations = Modernizr.cssanimations;
        this.supportTransitions = Modernizr.csstransitions;
        this._initEvents();
    },

代码笔与一切 - http://codepen.io/eclipsewebdesign/pen/FcuGJ/

这可能吗?任何帮助将不胜感激,我尝试使用JQuery,但由于我的知识有限,我没有成功。

谢谢

$('.top-menu').click(function() {
    $(this).fadeIn('fast', function() {
        if($(this).next().length > 0) {
            $(this).fadeOut('fast', function() {
                $(this).next().fadeIn('fast');
        });
        }
    });
});

像这样的东西?