2

我想使用Efeckt.css 提供的一些效果- 按钮和屏幕外导航。查看源代码，我可以看到它被整齐地安排为模块化。

我已经克隆了这个项目，但我真的不知道如何以用户身份开始——这些文档似乎是针对贡献者的。

假设我只想包含一个按钮。我尝试将demo.autoprefixed.cssandeffeckt.autoprefixed.css文件复制到我自己的项目中，然后这样做：

  <link rel="stylesheet" href="assets/css/m.autoprefixed.css">
  <link rel="stylesheet" href="assets/css/effeckt.autoprefixed.css">
  ...
  <div class="button-demo-wrap">
    <button class="effeckt-button slide-left"><span class="label">Slide Left</span> <span class="spinner"></span></button>
  </div>

这不起作用，而且它包含大量代码，我不需要一个按钮。我如何开始这个项目？

4

1 回答 1

2

这似乎与 JavaScript 有关。

我检查了该站点，似乎 Efeckt.css 是一个 CSS 框架，需要一些 Javascript 来触发动画。以下代码（也在 JS-Fiddle 中）在他们的演示站点上引用的 buttons.js 中找到。

我在这里做了一个关于如何使用这些按钮的示例演示：http: //jsfiddle.net/fc6ux/

相关部分如下：

$('.effeckt-button').on( 'click', function(){
    showLoader(this);
});

function showLoader(el) {
    var button = $(el),
        resetTimeout;

    if(button.attr( 'data-loading' )){
        button.removeAttr( 'data-loading' );
    } 
    else {
        button.attr( 'data-loading', true );
    }

    clearTimeout( resetTimeout );
    resetTimeout = setTimeout( function() {
        button.removeAttr( 'data-loading' );
    }, 2000 );
}
于 2013-07-22T13:52:07.817 回答