我对网络开发有相当多的了解，但我从未实现过任何第三方 Javascript 插件，所以我有点困惑。任何帮助将不胜感激。
好吧，假设我想使用一个名为 flippant 的插件。 http://labs.mintchaos.com/flippant.js/
我从插件中获取了 CSS 和 JS 文件，并将它们放入我的标签中:
<head>
<link rel="stylesheet" type="text/css" href="Record.css">
<link rel="stylesheet" type="text/css" href="flippant.css">
<script src="Record.js" type="text/javascript"></script>
<script src="flippant.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
</head>
^这就是 Flippant.js 和 Flippant.css
现在假设我想应用这个插件来在点击一个简单的 div 容器时翻转它。
<div id="container">
</div>
现在它在上面链接的网站上为您提供了方向/代码，所以我不会在此处链接它。它位于“为什么和如何”副标题下。
假设我想在上面的代码中点击 div 容器时翻转它，我该如何使用这个插件来做到这一点？
最佳答案
您链接的页面有以下代码示例:
var front = document.getElementByID('flipthis');
var back_content = "<h1>I'm the back!</h1>"; // Generate or pull any HTML you want for the back.
var back;
// when the correct action happens, call flip!
back = flippant.flip(front, back_content);
// this creates the back element, sizes it and flips it around.
// invoke the close event on the back element when it's time to close.
// call the close method on the back element when it's time to close.
back.close();
您可以在容器对象的某些特定用户事件上实现类似的操作。
例如，您可以将该代码的版本放入函数中，然后在按钮的点击处理程序上调用该函数:
function myFlip() {
var container = document.getElementByID('container');
var back_content = "<h1>I'm the back!</h1>"; // Generate or pull any HTML you want for the back.
var back;
// when the correct action happens, call flip!
back = flippant.flip(container, back_content);
// this creates the back element, sizes it and flips it around.
// invoke the close event on the back element when it's time to close.
// call the close method on the back element when it's time to close.
back.close();
}
// assume you have a button with id="myButton"
document.getElementById("myButton").onclick = myFlip;
关于javascript - 如何实现第三方Javascript库？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17414807/