메뉴 드롭다운이 작동 안하는 이유가....

메뉴 드롭다운이 작동 안하는 이유가....

QA

메뉴 드롭다운이 작동 안하는 이유가....

본문

아래 소스는 이미지가 롤링되는 소스인데요.

이 소스를 사용하면 그누 메뉴의 2단계가 드롭다운이 작동을 안합니다.

어디에서 충돌이 일어나는 걸까요?

 

 Element.Events.extend({
    'wheelup': {
        type: Element.Events.mousewheel.type,
        map: function(event){
            event = new Event(event);
            if (event.wheel >= 0) this.fireEvent('wheelup', event)
        }
    },
    'wheeldown': {
        type: Element.Events.mousewheel.type,
        map: function(event){
            event = new Event(event);
            if (event.wheel <= 0) this.fireEvent('wheeldown', event)
        }
    }
});
 ////
if( typeof(LofSlideshow) == 'undefined' ){
    var LofFlashContent = new Class( {
        initialize:function( eMain, eNavigator, eNavOuter, options ){
            this.setting = Object.extend({
                autoStart            : true,
                descStyle            : 'sliding',
                mainItemSelector    : 'div.lof-main-item',
                navSelector          : 'li' ,
                navigatorEvent        : 'click',
                interval               :  2000,
                auto                : false,
                navItemsDisplay        : 3,
                startItem            : 0,
                navItemHeight        : 100
            }, options || {} );
            this.currentNo  = 0;
            this.nextNo     = null;
            this.previousNo = null;
            this.fxItems    = [];    
            this.minSize     = 0;
            if( $defined(eMain) ){
                this.slides       = eMain.getElements( this.setting.mainItemSelector );
                this.maxWidth  = eMain.getStyle('width').toInt();
                this.maxHeight = eMain.getStyle('height').toInt();
                this.styleMode = this.__getStyleMode();  
                var fx =  Object.extend({waiting:false}, this.setting.fxObject );
                this.slides.each( function(item, index) {
                    item.setStyles( eval('({"'+this.styleMode[0]+'": index * this.maxSize,"'+this.styleMode[1]+'":Math.abs(this.maxSize),"display" : "block"})') );        
                    this.fxItems[index] = new Fx.Styles( item,  fx );
                }.bind(this) );
                if( this.styleMode[0] == 'opacity' || this.styleMode[0] =='z-index' ){
                    this.slides[0].setStyle(this.styleMode[0],'1');
                }

                eMain.addEvents( { 'mouseenter' : this.stop.bind(this),
                                      'mouseleave' :function(e){ 
                                    this.play( this.setting.interval,'next', true );}.bind(this) } );
            }
            if( $defined(eNavigator) && $defined(eNavOuter) ){
                this.navigatorItems = eNavigator.getElements( this.setting.navSelector );
                if( this.setting.navItemsDisplay > this.navigatorItems.length ){
                    this.setting.navItemsDisplay = this.navigatorItems.length;    
                }
                eNavOuter.setStyle( 'height',this.setting.navItemsDisplay*this.setting.navItemHeight);
                this.navigatorFx = new Fx.Style( eNavigator, 'top',
                                                {transition:Fx.Transitions.Quad.easeInOut,duration:800} );
                this.registerMousewheelHandler( eNavigator ); // allow to use the srcoll
                this.navigatorItems.each( function(item,index) {
                    item.addEvent( this.setting.navigatorEvent, function(){                                                     
                        this.jumping( index, true );
                        this.setNavActive( index, item );    
                    }.bind(this) );
                        item.setStyle( 'height', this.setting.navItemHeight );        
                }.bind(this) );
                this.setNavActive( 0 );
            }
        },
        navivationAnimate:function( currentIndex ) { 
            if (currentIndex <= this.setting.startItem 
                || currentIndex - this.setting.startItem >= this.setting.navItemsDisplay-1) {
                    this.setting.startItem = currentIndex - this.setting.navItemsDisplay+2;
                    if (this.setting.startItem < 0) this.setting.startItem = 0;
                    if (this.setting.startItem >this.slides.length-this.setting.navItemsDisplay) {
                        this.setting.startItem = this.slides.length-this.setting.navItemsDisplay;
                    }
            }        
            this.navigatorFx.stop().start( -this.setting.startItem*this.setting.navItemHeight );    
        },
        setNavActive:function( index, item ){
            if( $defined(this.navigatorItems) ){ 
                this.navigatorItems.removeClass('active');
                this.navigatorItems[index].addClass('active');    
                this.navivationAnimate( this.currentNo );    
            }
        },
        __getStyleMode:function(){
            switch( this.setting.direction ){
                case 'opacity': this.maxSize=0; this.minSize=1; return ['opacity','opacity'];
                case 'vrup':    this.maxSize=this.maxHeight;    return ['top','height'];
                case 'vrdown':  this.maxSize=-this.maxHeight;   return ['top','height'];
                case 'hrright': this.maxSize=-this.maxWidth;    return ['left','width'];
                case 'hrleft':
                default: this.maxSize=this.maxWidth; return ['left','width'];
            }
        },
        registerMousewheelHandler:function( element ){ 
            element.addEvents({
                'wheelup': function(e) {
                    
                    e = new Event(e).stop(); 
                        this.previous(true);
                }.bind(this),
             
                'wheeldown': function(e) {
                    e = new Event(e).stop();
                
                    this.next(true);
                }.bind(this)
            } );
        },
        registerButtonsControl:function( eventHandler, objects, isHover ){
            if( $defined(objects) && this.slides.length > 1 ){
                for( var action in objects ){ 
                    if( $defined(this[action.toString()])  && $defined(objects[action]) ){
                        objects[action].addEvent( eventHandler, this[action.toString()].bind(this, [true]) );
                    }
                }
            }
            return this;    
        },
        start:function( isStart, obj ){
            this.setting.auto = isStart;
            // if use the preload image.
            if( obj ) {
                var images = [] 
                this.slides.getElements('img').each( function(item, index){
                    images[index] = item.getProperty('src');
                } );
                this.preloadImages( images, this.onComplete(obj) );
            } else {
                if( this.setting.auto && this.slides.length > 0 ){
                        this.play( this.setting.interval,'next', true );}    
            }
        },
        onComplete:function( obj ){
            (function(){                                                                
                    new Fx.Style( obj ,'opacity',{ transition:Fx.Transitions.Quad.easeInOut,
                                                         duration:800} ).start(1,0)}).delay(400);
            if( this.setting.auto && this.slides.length > 0 ){
                this.play( this.setting.interval,'next', true );}    
            
        },
        preloadImages:function( images, _options ){
            var options=Object.extend({
                                      onComplete:function(){},
                                      onProgress:function(){}
                                      },_options||{});
            var loaded=[];
            var counter=0;
            images.each( function( image ){ 
                var img = new Asset.image(image, {
                    'onload': function(){
                        options.onProgress.call(this, counter, images.indexOf(image));
                        counter++;
                        if (counter == images.length) options.onComplete();
                    },
                    'onerror': function(){
                        options.onProgress.call(this, counter, images.indexOf(image));
                        counter++;
                        if (counter == images.length) options.onComplete();
                    }
                });
            });
        },
        onProcessing:function( manual, start, end ){            
            this.previousNo = this.currentNo + (this.currentNo>0 ? -1 : this.slides.length-1);
            this.nextNo     = this.currentNo + (this.currentNo < this.slides.length-1 ? 1 : 1- this.slides.length);                
            return this;
        },
        finishFx:function( manual ){
            if( manual ) this.stop();
            if( manual && this.setting.auto ){ 
                this.setNavActive( this.currentNo );    
                this.play( this.setting.interval,'next', true );
            }        
        },
        getObjectDirection:function( start, end ){
            return eval("({'"+this.styleMode[0]+"':["+start+", "+end+"]})");    
        },
        fxStart:function( index, obj ){
            this.fxItems[index].stop().start( obj );
            return this;
        },
        jumping:function( no, manual ){
            this.stop();
            if( this.currentNo == no ) return;        
            this.onProcessing( null, manual, 0, this.maxSize )
                .fxStart( no, this.getObjectDirection(this.maxSize , this.minSize) )
                .fxStart( this.currentNo, this.getObjectDirection(this.minSize,  -this.maxSize) )
                .finishFx( manual );    
                this.currentNo  = no;
        },
        next:function( manual , item){
            this.currentNo += (this.currentNo < this.slides.length-1) ? 1 : (1 - this.slides.length);    
            this.onProcessing( item, manual, 0, this.maxSize )
                .fxStart( this.currentNo, this.getObjectDirection(this.maxSize ,this.minSize) )
                .fxStart( this.previousNo, this.getObjectDirection(this.minSize, -this.maxSize) )
                .finishFx( manual );
        },
        previous:function( manual, item ){
            this.currentNo += this.currentNo > 0 ? -1 : this.slides.length - 1;
            this.onProcessing( item, manual, -this.maxWidth, this.minSize )
                .fxStart( this.nextNo, this.getObjectDirection(this.minSize, this.maxSize) )
                .fxStart( this.currentNo,  this.getObjectDirection(-this.maxSize, this.minSize) )
                .finishFx( manual    );            
        },
        play:function( delay, direction, wait ){
            this.stop(); 
            if(!wait){ this[direction](false); }
            this.isRun = this[direction].periodical(delay,this,true);
        },stop:function(){; $clear(this.isRun ); }
    } );
}
 

이 질문에 댓글 쓰기 :

답변 1

소스를 자세히 본건 아니지만, 

저 js 소스중에 에러코드가 있으면 , 그 이후의 js가 전부 실행되지않기때문에 

브라우저 콘솔로 위의 코드중에 에러코드가 있는지 확인 후 수정하시던가, 

아니면 저 코드의 위치를 다른 스크립트 코드보다 아래에 위치하구요, 그다음에 오류 천천히 

해결해보시면 될거같네요! 

 

근데 이 이유가 아닐수도있어요 ㅎㅎ

답변을 작성하시기 전에 로그인 해주세요.
전체 123,660 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT