JS / CSS幻灯片效果适用于小提琴，而不是html

我的第一个问题是关于小提琴不工作。 现在它可以工作，但是如果我将它复制到我的括号文件中它就不再起作用了。 我确实包含了我放在外部资源中的链接。 这是小提琴： https ： //jsfiddle.net/wtbdxx2b/6/

和HTML;

          click  
 hello 
   

css;

 .content { position: absolute; width: 100%; height: 10%; bottom: 0; left: 0; background-color: #000; color: #FFF; transition: all 1s; } .content.open { height: 90%; } 

和javascript;

 $(".trigger").click(function() { $(".content").toggleClass("open"); }); 

Answer 1

放

 $(".trigger").click(function() { $(".content").toggleClass("open"); }); 

内

 $(document).ready(function(){ $(".trigger").click(function() { $(".content").toggleClass("open"); }); });