JQuery: animate() doesn't work as expected in IE

后端 未结 8 1003
广开言路
广开言路 2021-01-06 02:17

I\'m getting crazy with this IE 7...

==> hhttp://neu.emergent-innovation.com/

Why does following function not work in IE 7, but perfectly with Firefox? Is th

8条回答
  •  予麋鹿
    予麋鹿 (楼主)
    2021-01-06 03:03

    As stated by Paul, when using the method. Animate () jQuery IE7 browser does not recognize internally the property 'position'. eg

    CSS rule:

    li p (bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)
    

    Implementation of animation in jQuery:

    $('li').hover(function(){
    
                  $this = $(this);
    
                  var bottom = '-45px'; //valor default para subir.
    
                  if( $this.css('height') == '320px' ){bottom = '-115px';}
    
                  $this.css('cursor', 'pointer').find('p').stop().find('.first').hide().end().animate({bottom: bottom}, {queue:false, duration:300});
    
          }, function(){
    
             var $this = $(this);
    
             var bottom = '-178px'; //valor default para descer
    
                if( $this.css('height') == '320px' ){bottom = '-432px';}
    
             $this.find('p').stop().animate({***position: 'absolute'***, bottom:bottom}, {queue:false, duration:300}).find('.first').show();
    
          });//fim do hover()
    

    What to work in all browsers:

    CSS rule:

    li p (position: absolute; left: 0; bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)
    

    JQuery code:

       $('li').hover(function(){
    
                     $this = $(this);
    
             var bottom = '-45px'; //valor default para subir.
    
                  if( $this.css('height') == '320px' ){bottom = '-115px';}
    
                  $this.css('cursor', 'pointer').find('p').stop().find('.first').hide().end().animate({bottom: bottom}, {queue:false, duration:300});
    
          }, function(){
    
             var $this = $(this);
    
             var bottom = '-178px'; //valor default para descer
    
                if( $this.css('height') == '320px' ){bottom = '-432px';}
    
             $this.find('p').stop().animate({bottom:bottom}, {queue:false, duration:300}).find('.first').show();
    
          });//fim do hover()
    

    In my case it was resolved this way.

提交回复
热议问题