jquery lavalamp style работает на codepen, но не на jsfiddle

Я пытаюсь создать стиль лавы в jquery. Он работает в кодепине, но не в jsfiddle или моих собственных веб-страницах. Может ли кто-нибудь помочь мне разобраться, в чем проблема?jquery lavalamp style работает на codepen, но не на jsfiddle

Jquery код

// adds sliding underline HTML 
jQuery('#menu').append('<li class="slide-line"></li>'); 

// animate slide-line on click 
jQuery(document).on('click', '#menu li a', function() { 

     var $this = jQuery(this), 
      offset = $this.offset(), 
      //find the offset of the wrapping div 
      offsetBody = jQuery('#box').offset(); 

     // GSAP animate to clicked menu item 
     TweenMax.to(jQuery('#menu .slide-line'), 0.45, { 
      css:{ 
      width: $this.outerWidth()+'px', 
      left: (offset.left-offsetBody.left)+'px', 
      top: (offset.top-offsetBody.top+$(this).height())+'px' 
      }, 
      ease:Power2.easeInOut 
     }); 

     return false; 
}); 

jQuery('#menu > li a').first().trigger("click");

Работа демо codepen
Codepen demo

Не работает демо jsfiddle/нормальные веб-страниц
JSFiddle demo

источник

2014-10-03 Kevin Ammerlaan

В консоли указано, что TweekMax не определен. Откуда это? –

Я действительно понятия не имею. Я получил код из этого исходного кода. Http://codepen.io/jonathan/pen/wBDHA. Но я ничего не могу найти о TweekMax в этом коде? Я не профессиональный пользователь jQuery, поэтому я ничего не понимаю в коде, кроме того, что он не работает на моей веб-странице, когда он работает на codepen –

У вас не хватает этой библиотеки

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.4/TweenMax.min.js"></script>

Просто добавьте его в раздел головы вашего html.

источник

2014-10-03 11:17:30

jquery lavalamp style работает на codepen, но не на jsfiddle

ответ

Смежные вопросы